Jquery 如果下一个元素可见，则移除悬停效果

我创建了一个简单的框，当单击它以显示内容时，它应该打开/关闭。我还想在h2元素上使用鼠标悬停。这是可行的，但是当盒子打开时，不应该有悬停效果

这可以通过CSS来完成，还是我必须使用JS

$（'.box>h2'）。在（'click'，function（）上{
$（this.next（'div'）.slideToggle（）；
});
.box h2{
填充：.5em；
}
.框h2：悬停{
背景色：#ccc；
}
.box>div{
显示：无；
}

标题
任何内容
jQuery有一个
：可见的
选择器。您可以切换
悬停
类


$（'.box>h2'）。在（'click'，function（）上{
$（this）.removeClass（'hover'）.next（'div'）.slideToggle（）；
}).hover（函数（）{
if（！$（this.sillides（'div'）。是（'：可见的'））{
$（this.addClass（'hover'）；
}
}，函数（）{
$（this.removeClass（'hover'）；
});
.box h2{
填充：.5em；
}
.框h2.悬停{
背景色：#ccc；
}
.box>div{
显示：无；
}

标题
任何内容
仅使用CSS无法做到这一点，但您可以使用
toggleClass（）
jQuery方法对jQuery代码进行一点更改，以实现这一点：

当
有一个
.closed
类时，只需在CSS中添加悬停效果，然后每次执行
slideToggle（）
操作时，都会从单击的元素中删除/添加
.closed
类。您可以在此处看到修改的代码：


$（'.box>h2'）。在（'click'，function（）上{
$（this.next（'div'）.slideToggle（）；
$（this.toggleClass（'closed'）；
});
.box h2{
填充：.5em；
}
.框h2.关闭：悬停{
背景色：#ccc；
}
.box>div{
显示：无；
}

标题
任何内容
这种“悬停效应”是什么？如果您指的是背景色：#ccc，没有问题。你是说像这样？这个条件可以用Jquery处理。不确定css。您不能在css中遍历。遗憾的是，你不能说“好吧，显示了div，现在让我们修改前面的元素”。你必须在这里使用JS。
toggleClass（）
对我来说非常有意义