jquery - 仅将 'active' 类分配给最深的子级

Question

我有一个基于 Bootstrap 的 < UL > 导航树，其中当前页面路径中的每个 < LI > 都被赋予“事件”类。因此，如果我在主页以下两层的页面上，代码大致如下:

<ul>
  <li>Link1</li>
  <li>Link2</li>
  <li class='active'>Link3
    <ul>
      <li>sublink1</li>
      <li class=active>sublink2
        <ul>
          <li>subsublink1</li>
          <li class=active>subsublink2 THIS IS MY PAGE</li>
        </ul>
      </li>
    </ul>
  </li>

问题在于 bootstrap 为所有 li.active 元素添加了边框。我只希望边框应用于最深的边框，即我实际所在的页面。

我不会弄乱 Bootstrap 的基础，因此我不会从整个路径中删除事件类。

我的目标是让 jQuery 删除不需要的边框。我想找到任何没有 li.active 子代的 li.active，这表明它是路径中最深的 li.active。然后找到所有具有 li.active 的父级并删除它们的边框。

我如何构建该 JQUERY？

我在想这样的事情(知道 notHasClass 不存在):

$('li.active').children().notHasClass('active').parents.hasClass('active').css('border','none');

Answer 1

查找所有包含另一个 .active 元素的 li.active 元素并删除边框:

$('li.active:has(.active)').css({ border : 'none' });

http://jsfiddle.net/X8K4E/