javascript - jQuery 定位 `ul` 中的下一个 `li` 元素，类为 `active`

Question

无法弄清楚我做错了什么，因为我没有收到任何错误。本质上，我想定位包含 active 类的唯一 li 中的下一个 ul 元素。

我的 HTML 是:

<li id="abc"></li>
<li id="account" class="active">
  <a href="#"><img class="menu-logo-symbol" src=" /img/app/logo-symbol.png">Your Account</a>
  <ul class="nav-pills nav-stacked sub-nav nav-list" style="display: none;">
    <li id="account-details"></li>
    ......
  </ul>
</li>

我尝试过以下方法:

var checkElement = $('li.active').next('ul');
checkElement.slideDown('normal');

和

$('li.active').next('ul').show();

还有

$('li.active').next('ul').slideDown('normal');

谢谢

Answer 1

在 jQuery 中，next() 和 prev() 查找同级元素，或者在 DOM 中处于相同深度的元素。在这种情况下，由于 ul 是 .active 的子元素，因此您实际上需要使用 find() 方法，如下所示: $('li.active').find('ul').first().show();

将 first() 与 find() 结合使用可确保它仅返回单个 ul 元素，而不返回任何其他元素可能嵌套得更深。