我需要在许多不同页面上禁用许多表单的提交按钮,以便表单只提交一次。
我知道检查双重提交的正确方法最好是在服务器端完成,而不仅仅是禁用按钮,但我正在寻找一个简单的解决方案,目前应该这样做。
这是其中一个按钮:
<input type="submit" value="Save" />
这是我写的脚本
$(document).ready(function(){
$("input").each(function(index){
//find all submit buttons with value "Save"
if($(this).attr("value")=="Save"){
console.log(index);
$(this).click(function(){
//disable the button
$(this).attr("disabled","true");
console.log("save btn clicked");
//submit the form
var form = $(this).closest("form");
console.log(form.attr("action"));
form.submit();
});
}
});
});
一切都很好,直到我尝试提交的部分,按钮禁用得很好。问题是它没有提交(它在没有这个脚本的情况下提交)。
为什么不提交?我是找不到表格还是?
尝试。。。
$(form).submit();
而不是
form.submit();
$('form:has(input[value="Save"])').on('submit', function() {
alert('form submitted');
$('input[value="Save"]', this).attr('disabled', true);
});
input[disabled="disabled"] {
background-color: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form method="post" action="#">
<input type="submit" value="Save" />
</form>