Javascript 防止多表单提交

我使用JQuery和绑定到div（不是输入字段）的事件侦听器提交表单，并试图防止多次提交，这样客户就不会被多收费。我试图通过删除单击的div的

submit按钮

类来实现这一点，因此下次用户单击它时，JQuery将不会侦听与

submit按钮

关联的事件，以防止多次提交

然而，由于某些原因，使用下面的实现并不能阻止多次提交

HTML

注意：我必须坚持使用上面html的解决方案，因此使用类型为

submit

的

input

元素的解决方案将不会有用

---

我很感激任何关于如何使这项工作的建议。非常感谢

您可以使用

.one（）-

$(".submit-button").one('click',function(){
    //**submit form**
});


编辑：

如果出现错误：

function submitForm(){
    //**submit form**
   $.post('submit.php').error(function(){
        // rebind event on error
        $(".submit-button").one('click',submitForm);
   });
}
$(".submit-button").one('click',submitForm);

您可以使用以下内容：

$('something').one('click', function(){
   // submit code
});

这只会触发一次。
相当一部分用户不必费心点击提交按钮来提交表单-还有其他更方便的方法，比如当光标焦点位于表单字段上时按enter键

更健壮的方法是通过forms submit事件阻止表单，并维护一个变量以跟踪表单提交状态

var submitted = false;
$("form#myForm").submit(function(evt){
    if (submitted) {
        evt.preventDefault();//stops form submission
        return;
    }

    submitted = true;
});

对于这个例子，我省略了表单验证
 比我快13秒+谢谢你的建议！这似乎很有用，我从来没有听说过
one（）
：）但是，有一个小问题，如果有服务器错误，我需要重新启用以再试一次。。。这里有什么建议吗？@AnchovyLegend如果出现错误，您可以使用
.one（）
重新绑定事件。我不知道您所说的重新绑定事件是什么意思，很抱歉，我对这一切都很陌生，您能举个例子吗？非常感谢您的帮助：）@AnchovyLegend您是否使用ajax进行表单提交？因此，现在您必须处理重新验证和重新呈现。让我简单地说一下：如果你想让它正常工作，就要正确地做。这意味着“类型为
submit
的
input
元素”。它的存在是为了处理这个用例。如果您愿意，您可以让用户体验重新学习web浏览器开发人员在过去15年中彻底调试过的内容的乐趣，或者您也可以正确地进行调试。我推荐后者。我感谢您的回复。如果是我的选择，我会使用
输入
字段选择正确的方式。然而，即使使用
输入
字段方法，也需要采取一些措施来防止多个表单提交，这不是自动的。@AdamKG Pah！难道你不知道无障碍是为弱者准备的吗！复杂的设计提升了用户群的一致性。如果他们不喜欢，那么他们可以简单地打开控制台并编写自己的代码。
$('something').one('click', function(){
   // submit code
});

var submitted = false;
$("form#myForm").submit(function(evt){
    if (submitted) {
        evt.preventDefault();//stops form submission
        return;
    }

    submitted = true;
});