禁用按钮以避免多个表单提交答案

【问题标题】：Disable buttons to avoid multiple form submission禁用按钮以避免多个表单提交
【发布时间】：2019-05-14 11:29:33
【问题描述】：

我有一个 Web 表单，我注意到它会生成多个相同数据的提交（间隔大约 100 毫秒）。根据我的研究，表单提交后禁用按钮是要做的几件事之一。我有以下两种禁用表单按钮的方法：

Method 1:
$('form#my-form').submit(function(e) {
    $(this).find('button').prop("disabled",true);
    return true;
});

Method 2:
$('form#my-form').submit(function(e) {
    $(this).find('button').attr('onclick',"return false;");
});

让我们只关注在浏览器中提交表单时禁用按钮。哪种方法更好？还是其他更好的方法？有什么影响吗？我知道如果表单有多个用于不同事物的按钮，则方法 1 无法将单击哪个按钮的信息传递给后端。

【问题讨论】：

你可以使用 $("form").submit(function(){e.preventDefaults()});首次提交后
我认为这是基于意见或属于codereview，因为这不是问题，可以通过多种方式完成。
感谢您的意见。你能在代码中显示它吗？我之前尝试过，但不喜欢干净代码方面的代码（“在你第一次提交之后”）。
如果您将按钮类型属性设置为type="button"，它将不会触发表单。 This 可能会有所帮助
How to Prevent Users from Submitting a Form Twice 的可能重复项（第二个答案）

标签： javascript form-submit

【解决方案1】：

您可以使用该方法： event.preventDefault()

$('form#my-form').submit(function(e) {
     e.preventDefault() 
     //do somethings
}

【讨论】：

感谢您的帮助！这不会停止任何表单提交吗？

【解决方案2】：

试一试，我认为延迟可以让你的工作变得轻松。

 $('#id').on('click',function(){
    // let a common class(disable-btn) for each button which should be disabled for on second
    $('.disable-btn').prop('disabled',true);
    setTimeout(function(){
       // enable click after 1 second
       $('.disable-btn').prop('disabled',false);
    },1000); // 1 second delay
});

【讨论】：