javascript - 如何禁用拉达按钮？

Question

我使用 Ladda UI 进行 Bootstrap 。

使用 jquery，我尝试在用户单击按钮后禁用该按钮。

我尝试使用 ajax OnComplete/OnSuccess/OnBegin ，但无济于事 - 该按钮保持启用状态。

如果我在 firebug 上手动更改标记 - 我可以禁用它。另请注意 js 确实会触发。

这是标记:

<a id="icalSync" href="/iCal/iCalCreatedLinks" data-ajax-method="GET" data-ajax-complete="AjaxOnCompleteDisableButton" data-ajax="true" data-style="expand-left" class="btn ladda-button">
<span class="ladda-label">Sync iCal</span>
<span class="ladda-spinner"></span>
</a>

这是 js 函数:

function AjaxOnCompleteDisableButton() {
    $("#icalSync").attr("disabled", true);
}

如果有任何帮助，我将不胜感激。

Answer 1

禁用对于 anchor 标记无效，因此您可以尝试以下操作:

 function AjaxOnCompleteDisableButton() {
event.preventDefault();
 }

或者将您的 a#icalSync 更改为按钮并使用您的代码

<button id="icalSync" href="/iCal/iCalCreatedLinks" data-ajax-method="GET" data-ajax-complete="AjaxOnCompleteDisableButton" data-ajax="true" data-style="expand-left" class="btn ladda-button">
<span class="ladda-label">Sync iCal</span>
<span class="ladda-spinner"></span>
</button>

或者您可以添加在 Bootstrap 中使用的禁用类:

function AjaxOnCompleteDisableButton() { $("#icalSync").addClass("disabled"); }