javascript - addClass 活跃到 Bootstrap 导航

Question

目前，在 bootstrap3 导航下拉列表等中。

 <ul class="nav navbar-nav navbar-right">
    <li><a href="#">Link</a></li>
    <li class="dropdown">
      <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Dropdown <span class="caret"></span></a>
      <ul class="dropdown-menu" role="menu">
        <li><a href="#">Here's My Fancy St. Patties Day link!</a></li>
        <li><a href="#">Another link</a></li>
        <li><a href="#">Something else entirely here</a></li>
        <li class="divider"></li>
        <li><a href="#">Separated link</a></li>
      </ul>
    </li>
  </ul>

我通过 .active css 突出显示导航菜单项，并在父元素中添加一个简单的 jquery addClass:

$('a[href="' + this.location.pathname + '"]').parent().addClass('active');

当一个在所述页面上时，这会突出显示相应的菜单项。

我的问题是，我如何才能同时将类添加到容器“”(li > ul > li 等)？我一直在堆叠 .parent() 标签试图找到它，但没有运气。

编辑:

我认为像这样的东西会将事件类添加到容器 li class='dropdown':

$('a[href="' + this.location.pathname + '"]').parent().addClass('active');
$('li a[href="' + this.location.pathname + '"]').parent().eq(1).addClass('active');

..使用 .parent().eq()，但仍然是 nada!

Answer 1

遍历到最近的.dropdown

$('a[href="' + this.location.pathname + '"]').closest('.dropdown').addClass('active');