Jquery：toggleclass 但不在此 child。我该怎么做？

Jquery: toggleclass but not on this child. How do I do it?

我正在做一个简单的响应式 multi-level 菜单，我正在使用切换class 打开子菜单。

我想要的是，当我点击菜单打开子菜单时，如果有其他子菜单打开，它们会关闭，除了我刚刚打开的子菜单和可以通过单击其菜单 parent.

来关闭此子菜单

我目前使用这个代码：

$(document).ready(function(){
$(".menu > li").click(function(){
    $(".submenu.show-menu").toggleClass("show-menu"), 
    $(this).children(".submenu").toggleClass("show-menu")
    ;
});
});

JSFiddle: https://jsfiddle.net/g7d3wmnc/ 尝试通过单击菜单打开子菜单。然后单击另一个菜单以打开其子菜单。查看您打开的上一个子菜单如何关闭。这是正确的。 现在尝试通过单击其菜单来关闭刚刚打开的子菜单。你会看到它不起作用。就是这个问题。

此代码的问题是，如果我打开一个子菜单然后打开另一个子菜单，我打开的前一个子菜单将关闭。这样可行。 但是我无法关闭刚刚打开的子菜单，除非我打开另一个子菜单等等。

我认为是因为这一行：

$(".submenu.show-menu").toggleClass("show-menu"),

此代码将看到我打开的当前子菜单有 class show-menu 并将继续关闭 class，因为子菜单不再有 [=60] =]，下一行代码将继续打开 class，这是应该的。

那么，我该如何防止这种情况发生呢？我想如果我可以排除我正在单击第一行代码的菜单的子菜单，那么它将按我想要的方式工作，但我不知道该怎么做.我是 Jquery.

的新手

我试过了：

$(".submenu.show-menu").not(this).toggleClass("show-menu")
$(".submenu.show-menu").not(this).children(".submenu").toggleClass("show-menu")

这是我正在尝试的网站： http://etrostruewowdesigncomplete2.esy.es/phpBB3/index.php?sid=2ae138c61784f734c9d98c0944359e42

只有window的尺寸在999px以下才能看到响应式菜单，需要在放大镜上click/tap才能打开（主题还没画完） )

那里。

这段代码应该更适合您：

$(document).ready(function(){
  $(".menu > li").click(function(){
    $(".submenu").removeClass("show-menu");
    $(this).children(".submenu").toggleClass("show-menu");
    ;
  });
});

在您使用的代码中

$(".submenu.show-menu").not(this).toggleClass("show-menu");

到 select 个元素显示除活动元素以外的菜单。这是错误的，因为 this 在这种情况下指的是 span 元素。这是一个工作演示。

https://jsfiddle.net/8fx2u56w/

但我猜你希望得到像 https://jsfiddle.net/6Lu8ajp2/

这样的解决方案

Jquery：toggleclass 但不在此 child。我该怎么做？

Jquery: toggleclass but not on this child. How do I do it?

css

jquery

menu