Jquery 将类添加到单击的项、父项和父项，并将其从所有其他项中删除

这是html结构

<ul>
  <li>
    <a href="#">Stone age</a> > active
    <ul>
      <li>
        <a href="#">Mesolithic</a> > active
        <ul>
          <li>
            <a href="#">Culture</a> > active
          </li>
        </ul>
      </li>
      <li>
        <a href="#">Neolithic</a> > not active > click > this active the others not active
      </li>
    </ul>
  </li>
</ul>

如何在同级、父级和其他元素之间切换“活动”类？

类似以下内容：

$（“#myId a”）。单击（“click”，函数（e）{
e、 预防默认值（）；
//首先删除所有活动类
$（this）.最近的（'#myId'）.find（'a'）.removeClass（'active'）；
//然后首先添加到单击的元素
$（this.addClass（'active'）；
//还有它的父母
$（this）.parents（）.children（'li a'）.addClass（'active'）；
});
.active{
颜色：绿色；
}



石器时代>活跃


中石器时代>活动期


文化>活动




新石器时代


中石器时代


文化




新石器时代





类似的内容：


$（“#myId a”）。单击（“click”，函数（e）{
e、 预防默认值（）；
//首先删除所有活动类
$（this）.最近的（'#myId'）.find（'a'）.removeClass（'active'）；
//然后首先添加到单击的元素
$（this.addClass（'active'）；
//还有它的父母
$（this）.parents（）.children（'li a'）.addClass（'active'）；
});
.active{
颜色：绿色；
}



石器时代>活跃


中石器时代>活动期


文化>活动




新石器时代


中石器时代


文化




新石器时代





如果您可以将id（或其他唯一标识方法）添加到顶级ul元素中，这将变得相当容易。一种方法如下：


$（函数（）{
$（'#菜单a'）。在（'单击'）上，函数（e）{
e、 预防默认值（）；
$（“#菜单a”）.removeClass（'active'）；
$（this）.addClass（'active'）。parents（'li'）。parents（'li'）。children（'a'）。addClass（'active'）。end（）。parents（'li'）。children（'a'）。addClass（'active'）；
});
});
.active{
颜色：红色
}



石器时代


中石器时代


文化




新石器时代



如果您可以将id（或其他唯一标识方法）添加到顶级ul元素中，这将变得相当容易。一种方法如下：


$（函数（）{
$（'#菜单a'）。在（'单击'）上，函数（e）{
e、 预防默认值（）；
$（“#菜单a”）.removeClass（'active'）；
$（this）.addClass（'active'）。parents（'li'）。parents（'li'）。children（'a'）。addClass（'active'）。end（）。parents（'li'）。children（'a'）。addClass（'active'）；
});
});
.active{
颜色：红色
}



石器时代


中石器时代


文化




新石器时代



哪些元素上实际有class=“active”？你的html示例没有这样的内容好吧，我更新了这个问题，但是如果你仔细检查最外层的
是否被另一个元素包装，或者它是否有类或id，我会在类处于活动状态时写下这个问题？只需询问原因，就可以很容易地删除
$（this）.parent（）.parent（）.parent（）
如果我想添加id，那么我可以添加一个id，但如何在同级、父级和其他元素之间切换类？@caramba检查哪些元素上实际有class=“active”？你的html示例没有这样的内容好吧，我更新了这个问题，但是如果你仔细检查最外层的
是否被另一个元素包装，或者它是否有类或id，我会在类处于活动状态时写下这个问题？只要问原因，就可以很容易地删除
$（这个）。parent（）.parent（）.parent（）
如果我愿意，我可以添加一个id是的，但是我如何在兄弟姐妹、parent和其他元素之间切换类？@caramba check ok这是有道理的，但我要跟你说实话，我正在寻找一个更通用的解决方案，因为这样做确实可以用固定级别的嵌套ul回答我的问题，但是如果在任何情况下我们有第四个级别，那么需要更改整个js路径以定位els。但是你所做的很好，谢谢，这是有道理的，但是我对你说实话，我正在寻找一个更通用的解决方案，因为这样做确实会用固定级别的嵌套ul回答我的问题，但是如果在任何情况下，我们有第四个级别，那么需要改变整个js路径来针对els。但你所做的很好，thanks@rob.m美好的很高兴我能帮忙，很高兴coding@rob.m美好的很高兴我能帮忙，很高兴
$("a").on("click", function(e) {
    e.preventDefault();
    var $parent = $(this).parent().parent().parent().find("a");
    $("a").not($parent).not($parent.nextAll()).removeClass("active");
    $(this).toggleClass("active");
    $(this).nextAll("ul").toggleClass("closed opened");
});