Question

我在所有asp.net网络应用程序上都有以下提交按钮，用于创建或编辑记录： -

<input type="submit" value="Save" class="btn btn-primary"/>

但是我需要编写一个jQuery来在用户点击它时禁用该按钮（以避免对外部系统进行连续的API调用）。所以我编写了这段代码，但点击后按钮不会被禁用。

  $(".btn btn-primary").click(function () {
            $("input[type=submit]").attr("disabled", "disabled");
            $("input[type=submit]").css("background-color", "grey");
        });

第二个问题我应该遵循哪种方法，因为我需要再次重新启用该按钮，以便在单击提交按钮后发生模型状态错误。请有人建议

Answer 1

试试这个：

$(".btn.btn-primary").click(function () {
    $("input[type=submit]").attr("disabled", "disabled");
    $("input[type=submit]").css("background-color", "grey");
    return false;
});

Answer 2

您的选择器错误

$(".btn.btn-primary").click(function () {
    $(this).prop("disabled", "disabled").css("background-color", "grey");
});

<小时/> this

Answer 3

更改此

$(".btn btn-primary").click(function () {
            $("input[type=submit]").attr("disabled", "disabled");
            $("input[type=submit]").css("background-color", "grey");
        });

的

    $(".btn .btn-primary").click(function (e) {

                $(this).attr({disabled:true});
                $("input[type=submit]").css("background-color", "grey");
            });

Answer 4

以上解决方案均未考虑表单提交是否成功。如果用户忘记填写必填字段怎么办？她会收到一条错误消息，尝试更正错误，然后发现她无法重新提交表单。即使你解决了这个问题，一旦用户刷新页面，她就可以再次提交。

表格的目的是什么？例如，如果它是一个注册表单，我只需在输入电子邮件地址后触发一个Ajax方法，该方法会检查数据库中的电子邮件地址，并阻止用户尝试两次注册相同的电子邮件地址。另一方面，如果您正在进行调查，并且您希望阻止来自同一用户的多个提交，我会创建一个cookie。在DOM准备好后，您的脚本将查找cookie。如果cookie存在则不显示表单。

Answer 5

$(".btn.btn-primary").click(function () {
  $(this).attr('disabled','disabled');
}

Answer 6

试

 $(".btn.btn-primary").click(function () {
        $(this).attr("disabled", "disabled")
               .css("background-color", "grey");
        e.preventDefault();

    });

Answer 7

要在稍后阶段重新启用

$("input[type=submit]").removeAttr("disabled");

如何禁用特定类下的提交按钮

7 个答案: