Question

我的视图上有一个按钮链接，如下所示：

<a href="@Url.Action("ActionName", "ControllerName", new { id = Model.Id})" id="My-Btn" class="btn btn-info pull-right" data-role="button">Go Somewhere</a>

现在，我在我的页面上使用ajax将值提交给我的webApi控制器方法，当我这样做时，我希望禁用按钮链接。这是我的ajax：

$.ajax({
    url: myUrl,
    method: "DELETE",
    beforeSend: function () {
        disableSendButton();
    },
    success: function() {
        row.remove();

        toastr.options = {
            onHidden: function () {
                window.location.href = redirectUrl;
            },
            timeOut: 2000
        }
        toastr.success("Success.");
    }
});

function disableSendButton() {
    $("#My-Btn").addClass("ui-disabled");
}

这对我不起作用。在ajax调用期间，该按钮仍处于活动状态。如何在ajax调用期间禁用此按钮？

Answer 1

使用

$("#My-Btn").prop('disabled', true).addClass("disabled");

并添加CSS

.disabled{
  cursor: not-allowed;
}

这会在你的按钮上放置一个禁用的光标。

Answer 2

你可以在按钮上试试这个.attr("disabled", "disabled");

在发送ajax之前禁用按钮链接

2 个答案: