javascript - 列表 元素即使在移动设备上调用 .hide() 后也不会隐藏

Question

html代码是

 <div id="navbar" class="navbar-collapse collapse">
 <ul class="nav navbar-nav navbar-right">
    <li id="faqNav"><a href="faq.php">FAQ</a></li>
    <li id="loginNav"><a href="#loginModal1" data-toggle="modal">Log In</a></li>
    <li id="accountNav1" class="visible-xs-block"><a href="profile.php">Account</a></li>
    <li id="accountNav2"  class="visible-xs-block nested"><a href="profile.php">My Profile</a></li>
    <li id="accountNav3" class="visible-xs-block nested" id="logoutNav" onclick="logout()"><a href="#">Log Out</a></li>
</ul>
</div>

jquery代码是

 $('#accountNavX' ).hide();

这没有用。我的最终目标是仅隐藏所有帐户导航列表项。

编辑:

是不是懒惰的 accountNavX 指的是我用相应的号码重复了三遍。

Answer 1

jQuery 通过直接在元素上写入 display:none 来隐藏。通常它优先于所有。 Bootstrap 将 !important 附加到它的 display: block 代码，从而防止 jquery 覆盖它。

您必须执行以下操作:

$('.accountNavX').removeClass('visible-xs-block').hide();