javascript - jQuery 在第二次单击时禁用按钮功能

Question

我试图阻止用户两次单击页面上的按钮，所以我一直在做的是在单击一次后用 jQuery 隐藏该按钮。但是有没有办法在单击一次后隐藏该按钮以使用 jQuery 禁用该按钮？

我试过了

$(document).ready(function () {
    $('#onClickHideButton').click(function () {
        $(this).prop('disabled', true);
    });
});

但是我在使用此功能时遇到的问题是，一旦单击按钮，它就会在它有机会提交表单之前被禁用，因此表单永远不会被提交。

Answer 1

为什么不在提交表单时禁用按钮，因为那是你真正想要做的......

$('#myForm').on('submit', function () {
    $('#myButton').prop('disabled', true);
});

Answer 2

而不是使用提交按钮，只需使用一个简单的按钮并手动发送表单提交。

<input type="button" id="onClickHideButton" value="Submit"/>

$('#onClickHideButton').click(function () {
     $(this).prop('disabled', true);
     $('#myform').submit();
});

或者您可以在提交表单时禁用该按钮

$('#myform').on('submit', function(e) { 
    $('#onClickHideButton').prop('disabled',true);
});