Jquery 折叠切换时移除类

当

slideToggle

折叠时，我试图从主体中删除一个类。现在，它在单击主体时删除类，在菜单打开时再次添加类

行为演示：

当单击主体时，它会折叠菜单并从主体中删除类，但当我们单击菜单项以折叠时，它不会从主体中删除类

---

我尝试了

if（$（“.menu item”）.hasglass（“active”）{$（“body”）.removeClass（“menu是active的”）

但它会以更糟糕的方式破坏代码。

要做到这一点，首先需要停止对

a

元素的单击，防止其在DOM中向上传播。这是因为在关闭所有菜单时，

单击
处理程序也放置在
文档
本身上，以删除样式

其次，当菜单处于活动状态时，您可以使用
toggleClass（）
仅将类应用于
主体


jQuery（文档）.ready（函数（$）{
$（“.nav菜单a”）。单击（功能（e）{
e、 停止传播（）；
$（this）.parent（）.toggleClass（'active'）.find（'.sub-menu'）.slideToggle（'fast'）；
$（“.nav menu a”）.not（this）.parent（）.removeClass（'active'）.find（'sub menu'）.slideUp（'fast'）；
$（“body”）.toggleClass（“菜单处于活动状态，$（'.nav menu li.active'）。长度！=0）；
});
});
$（文档）。在（“单击”）上，函数（事件）{
var$trigger=$（“.menu项”）；
if（$trigger！==event.target&！$trigger.has（event.target.length）{
$（“.sub-menu”）.slideUp（“fast”）.not（this.parent（）.removeClass（'active'）；
$（“body”）.removeClass（“菜单处于活动状态”）；
}
})；
。子菜单{
显示：无；
}
body.menu-is-active{
背景#fdff76；
}



菜单项

菜单项
菜单项
菜单项
菜单项



菜单项

菜单项
菜单项
菜单项
菜单项



菜单项

菜单项
菜单项
菜单项
菜单项



菜单项

菜单项
菜单项
菜单项
菜单项



菜单项

菜单项
菜单项
菜单项
菜单项



菜单项

菜单项
菜单项
菜单项
菜单项


谢谢您的回答。因此您只添加了
e.stopPropagation（）；
以防止单击行为重复？很好。除了单击子菜单中的菜单项外，一切正常。这会使菜单崩溃，但类不会从主体中移除。这是因为它被
$（“.nav menu a”）捕获
selector。您希望发生什么？没关系。我通过添加
$（“.nav primary.sub-menu a”）.解决了这个问题。单击（function（）{$（“body”）.removeClass（“menu is active”）}；