jquery防止提交按钮被双击及防止重复提交表单的方法

发布时间:2021-01-08编辑:脚本学堂
jquery如何防止提交按钮被双击,jquery如何防止重复提交表单,在页面中点击过发容易导致表单重复提交,如何避免这一问题呢,这里分享几个例子,大家参考下。

一、jquery防止提交按钮被双击的方法

涉及:jquery针对鼠标按键的操作,preventdefault方法对元素默认行为的修改。

jquery实现防止提交按钮被双击的方法。

复制代码 代码示例:
$("#submit").one('click', function (event) {
 event.preventDefault();
 //do something
 $(this).prop('disabled', true);
});

二、jquery防止表单重复提交

解决办法(只针对客户端):
用户点击提交按钮后给按钮添加disabled属性:
 

复制代码 代码示例:
$("input:submit").each(function() {
var srcclick = $(this).attr("onclick");
if(typeof(srcclick)=="function"){
$(this).click(function() {
if (srcclick()) {
setdisabled(this);
return true;
}
return false;
});}
});
function setdisabled(obj) {
setTimeout(function() { obj.disabled = true; }, 100);
}

三,jquery submit提交表单

jquery实现submit提交表单

使用jquery的submit()函数提交form表单时,总是无法提交表单。

因为form中提交表单的input的name属性为submit,把name改成其他的名称,就可以使用了。
表单可以提交之后,又出现了新的问题。

由于基于dz开发,表单提交之后使用submitcheck()这个函数来检查表单是否提交,由jquery提交上来的表单始终无法验证通过。

最后采用模拟点击提交按钮的方法来实现。
 

复制代码 代码示例:
<!-- lang: js -->
$('input#asubmit').trigger('click');