我想在提交表单后禁用表单,以防止重复提交。我认为非常标准的用例,但我能找到的所有示例都有缺陷。
我能找到的一切都是基于禁用提交按钮,但这并不妨碍如果用户在表单上按下回车键重新提交表单,这是一种非常常见的方法。
我正在考虑修改其中一个现有的脚本来解决这个问题,但在我重新发明轮子之前,有没有人知道已经正确处理这个问题并且他们能够共享的脚本?我真的很惊讶那里似乎还没有任何东西。
我想在提交表单后禁用表单,以防止重复提交。我认为非常标准的用例,但我能找到的所有示例都有缺陷。
我能找到的一切都是基于禁用提交按钮,但这并不妨碍如果用户在表单上按下回车键重新提交表单,这是一种非常常见的方法。
我正在考虑修改其中一个现有的脚本来解决这个问题,但在我重新发明轮子之前,有没有人知道已经正确处理这个问题并且他们能够共享的脚本?我真的很惊讶那里似乎还没有任何东西。
您可以创建一个布尔变量(或具有布尔成员变量的对象),并且仅在变量为 false 时提交表单。就像是:
function init() {
var submit = false;
var f = document.getElementById("FormID");
f.onsubmit = function() {
if(submit) {
return false;
} else {
submit = true;
return true;
}
}
}
当然,您必须init
在页面加载后调用,无论您选择哪种风格(window.onload = ...
、window.addEventListener(...)
、window.attachEvent(...)
等)。
var sent = false;
$('#form').submit(function(e) {
if (!sent) {
sent = true;
// do whatever
}
else e.preventDefault();
});
我尝试了很多解决方案,但没有一个对我有用。我用过这个,它工作得很好:
jQuery
<script>
$(document).ready(function(){
$('#buttonSubmit').click(function() {
if ($('#frm-confirm').attr('submitted')){
event.preventDefault();
} else {
$('#frm-confirm').attr('submitted',true);
}
});
});
</script>
HTML/PHP
<form id="frm-confirm" action="" method="post">
<input id="amount" name="amount" value="<?php echo round($_POST['amount'],2); ?>" type="hidden" />
<input id="order_id" name="order_id" value="<?php echo htmlspecialchars($_POST['order_id']);?>" type="hidden" />
<input type="submit" id="buttonSubmit" name="confirm" value="Confirm" />
</form>