jQuery ajaxSubmit 自动重复提交表单问题解决

jQuery ajaxSubmit 自动重复提交表单问题解决 个人笔记使用一、问题描述：当提交一次时一切看似正常，但是当提交第二次时，表单会进行两次提交，三次时会提交三次，以此类推。二、 解决后的效果如下图：三、准备工作：需要先引入jQuery.js 和 jQuery插件jQuery.form.js1、ajaxSubmit 封装代码如下：2、使用并提交表单代码如下：

个人笔记使用 一、问题描述：当提交一次时一切看似正常，但是当提交第二次时，表单会进行两次提交，三次时会提交三次，以此类推。 二、 解决后的效果如下图：

三、准备工作：需要先引入jQuery.js 和 jQuery插件jQuery.form.js 1、ajaxSubmit 封装代码如下： // triggerId 触发提交 ； event 鼠标事件中的那种触发方式 ； submitId 表单； url 请求地址； type 请求方式（get/post）；data 参数； success 请求成功 ；error 请求失败function formSubmit(triggerId,event,submitId,url,type,data,Boo,success,error) { $(triggerId).on(event,function () { $(submitId).ajaxSubmit({ url:url, type:type, data:data, async:Boo, dataType:'text', success:success, error:error }); return false; })}``// 2、使用并提交表单代码如下： formSubmit('#modifyAll',"click","#modifyData",'http://127.0.0.1:80/NursingHomes/php_api/patientsinformationchange.php','GET',{id:iptVal},false, function (res) { alert("修改成功") // 重置表单内容 $('#modifyData')[0].reset(); $('#searchId')[0].reset(); // 删除指定元素的所有事件处理程序 $("#modifyAll").unbind(); },function (err) { console.log("增加信息err:"+err); }) {id:iptVal} 这是我需要向后台传递的参数，如不需要传参数可以不填写，直接传一个空对象即可（ {} ）；防止表单重复提交，使用jQuery事件中的unbind()方法，在每一次提交表单成功时都使用unbind()方法，将提交表单的事件处理程序给删除，实现阻止重复提交的效果unbind()方法详见：W3C：https://www.w3school.com.cn/jquery/event_unbind.asp