如何防止用户两次提交表单

Question

<input type="submit" name="btnADD" id="btnADD" value="ADD"/>

当用户点击两次添加按钮时,从提交两次同样的数据到表中.所以请帮我限制用户两次提交.

Answer 1

提交表单后,使用jQuery附加一个处理程序,该程序员劫持并"禁用"提交处理程序:

var $myForm = $("#my_form");
$myForm.submit(function(){
    $myForm.submit(function(){
        return false;
    });
});

从提交处理程序返回"false"将阻止表单提交.禁用按钮可能会对表单的处理方式产生奇怪的影响.这种方法似乎基本上没有副作用,甚至可以在具有多个提交按钮的表单上工作.

非常喜欢.非常哇.如此优雅. (9认同)
对此的小抱怨是,每次用户点击按钮时,您将添加另一个事件处理程序.这不会导致任何问题,但有些人可能不希望这样.一个简单的解决方法是在添加新表单之前简单地删除表单上的任何"提交"处理程序. (2认同)

Answer 2

试试这个代码..

<input type="submit" name="btnADD" id="btnADD" value="ADD" onclick="this.disabled=true;this.value='Sending, please wait...';this.form.submit();" />

Answer 3

您可以在单击或隐藏按钮后禁用该按钮。

<input type="submit" name="btnADD" id="btnADD" value="ADD" onclick="disableButton(this)"/>

js：

 function disableButton(button) {
     button.disabled = true;
     button.value = "submitting...."
     button.form.submit();
}