jquery - Bootstrap 3 - 使用 jQuery 从动态加载的 li 中删除类 ="disabled"

Question

我正在使用 Bootstrap 3 并将通用菜单加载到我的所有 html 页面中。菜单中的一些元素被禁用，我想在某些页面上启用它们(即，当您将鼠标悬停在所选内容上时不再显示为灰色且没有红色圆圈)。我已阅读并尝试了以下解决方案。

HTML:

<ul class="dropdown-menu">
    <li><a class="dropdown-item" href="E1ActivitySelect.html">Activity - E1 Administration</a></li>
    <li><a href="#">Activity - E1</a></li>
    <li class="divider"></li>
    <li class="disabled" id="liCamp"><a href="Camp.html">Camps</a></li>
    <li class="disabled"><a class="dropdown-item" href="#">Hikes</a></li>
    <li class="disabled"><a href="#">Major Events</a></li>
    <li class="disabled"><a href="#">Pen Pals</a></li>
</ul>

JS:

$(document).ready(function(){
    //Include the common menu and amend
    $("#includedContent").load("Menu.html");

    // I have tried all these
    //  document.$("#liCamp").attr("disabled", false);
    //  document.$("#liCamp").attr("disabled", "");
    //  document.$("#liCamp").removeAttr("disabled");
    //  document.getElementById("liCamp").removeAttribute("class");
    //  document.getElementById("#liCamp").removeAttribute("class");
    //  document.$(".disabled").removeClass("disabled");
    document.$("#liCamp").removeClass("disabled");

Answer 1

您可以使用callback function对于 .load() 方法。

$("#includedContent").load("Menu.html", function(){
 $("#liCamp").removeClass("disabled");
});