一个页面向同一个地方提交两个form表单

一个页面向同一个地方提交两个form表单

湖北同事遇到这个问题,来问我,这个问题我之前也遇到过。

两个form 内容 class 和对应的参数一样

但是需要注意js提交登录信息时,需要定位到当前的点击对象

用ajaxBtn(this),给方法添加this参数。

一个页面向同一个地方提交两个form表单

当点击提交按钮,则触发οnclick=ajaxBtn(this);

会用到 Jquery的 parents方法

parents() 方法返回被选元素的所有祖先元素,返回的是jQuery对象

一个页面向同一个地方提交两个form表单

 选择器

一个页面向同一个地方提交两个form表单

$(obj).parents(".ajax_form")返回的是jQuery对象

 $(obj).parents()[0];返回的是元素  <div class="ajax_form">这个div块下的所有元素

一个页面向同一个地方提交两个form表单

 $(obj).parents()返回的是当前元素的所有父节点元素

一个页面向同一个地方提交两个form表单

  function ajaxBtn(obj) {

//获取$(obj).parents()[0]获取父节点

var objForm = $(obj).parents()[0];

var mobile = $(objForm).find('input[name="mobile"]').val();或者

var mobile =$(obj).parents(".ajax_form").find(".mobile").val();

一个页面向同一个地方提交两个form表单

获取手机号的传值结果

这里是分割线,下面是给同事的解释

是这样的,同一个页面向同一个地方提交2个表单 ,原来的写法因为名字 两个表处 ,div class='ajax_form' 是一样的 没法识别是哪个表单提交的 ,原来的触发提交按钮的方法ajaxBtn(),是不带参数this的,这个是修改后的

 添加一个参数,也就是this,方法这里 ajaxBtn(this)  ,目的是定位到当前点击 

一个页面向同一个地方提交两个form表单

js里面获取参数时需要注意,通过jQuery的parents()方法获取父节点元素,因为我们要获取mobile的值呀,所以会用到parents(),这样就获取到了父节点及其下面的子元素。

一个页面向同一个地方提交两个form表单


                       

点击阅读全文

上一篇 2023年 6月 15日 am10:50
下一篇 2023年 6月 15日 am10:52