Javascript 单击后禁用“提交”按钮，以防止用户向服务器发送多个请求

我想防止用户多次点击服务器按钮，导致多个类似的请求被发送到服务器

按钮是ASP.Net按钮（Webforms）。网站上有很多页面，我不想为每个按钮都写一些代码。我想在所有按钮的母版页上做

一个可能的解决方案是找到按钮并在单击后禁用它。比如：

$("input[type='submit']").click(function(){
  $(this).attr('disabled','disabled');   
});    

此代码工作正常，但会覆盖按钮的上一个onclick事件。因此，该按钮不执行提交或它想要执行的任何其他任务

另一个解决方案是禁用“onbeforesubmit”事件上的所有提交按钮。它们将在回发后立即启用。这也不是一个好的解决方案，因为有些按钮可以通过Ajax更新页面的一部分，并且在回发后，它们不能重新启用Ajax面板之外的其他按钮

有没有办法找到单击的提交按钮并禁用它并允许它执行onclick事件？

尝试使用：

将处理程序附加到元素的事件。处理程序被执行 每个事件类型的每个元素最多一次

---

另外，您应该使用

.prop（）

而不是

.attr（）

来设置

输入的状态

我找到了答案。因为我使用asp.net服务器按钮，所以如果我在客户端onclick事件中禁用该按钮，页面将不会被提交。相反，我在第二次单击时禁用了该按钮。在这种情况下，我可以确定页面已提交一次：

        $("input[type='submit']").click(function (e) {
            if (e.target && Page_IsValid) {
                var attr = $(this).attr('submitting');
                if (typeof attr !== 'undefined' && attr !== false) { // If button has submitting attribute then do not submit it again.
                    $(this).prop('disabled', true);
                    $(this).removeAttr("submitting");
                    e.preventDefault();
                }
                else {
                    $(this).attr("submitting", "true"); // Add "submitting" attribute to prevent multiple submissions.
                }
            }
        });

或者这个呢

$("body").on("click", ".js-submit-button", function() {
        var $this = $(this);
        $this.prop("disabled", true);
        $this.closest("form").submit();
    });

---

在jQuery1.9+版本中，使用

.prop（）

而不是

.attr（）

感谢您快速的回答。我以前试过这个，但有些页面不起作用。我找不到原因，但它在一些使用AJAX的页面中引起了非常奇怪的问题。我会尝试再次使用它，如果它有效的话，我会把贝克交给你。谢谢。这段代码不起作用，因为它仍然覆盖提交按钮的onclick。通过使用此选项，我的提交按钮（asp.net服务器按钮）不会执行任何操作，单击后它们将被禁用。

$("body").on("click", ".js-submit-button", function() {
        var $this = $(this);
        $this.prop("disabled", true);
        $this.closest("form").submit();
    });