javascript - 在按钮 onclick 事件后禁用整个 DIV 标签和里面的所有内容

Question

我有一个如下所示的 HTML 标记:

<div id="picing-selection" class="disableMe">
    <a class="upgradeSub" value="@ViewBag.Id">
        Upgrade <i class="fa fa-money"></i>
    </a>
</div>

定义的 onclick 事件如下所示:

$(document).on("click", ".upgradeSub", function() {
    $.post("/Subscription/UpgradeSubscription", {
        SubID: $(this).attr("value") 
    }).done(function(data) {
        if (data == "Ok") {
            $(this).prop('disabled', false);
            window.location.href = "/Index/Success";
        } else if (data == "Error") {
            alert("Something went wrong");
        }
    });
});

我想禁用任何 future 的 onclick 事件，直到服务器响应状态为“ok”或“Error”

我试过类似的方法:

$(document).on("click", ".upgradeSub", function() {
    $(this).prop('disabled', true);
    // After this goes the post to server
});

但这没有用...我仍然可以继续点击，jquery 将继续向服务器发送请求...

Answer 1

disable 属性对 div 不起作用。

一个解决方法是在 div 上添加一个 disable 类，只要你想禁用它，然后在点击监听器上首先检查 div 是否没有禁用的类来执行进一步的代码。