jQuery – 使用.mouseout或更合适的方法关闭下拉列表，提示？

我有以下代码：

$(".option_box .option_name").click(function () { $(this).siblings(".collapsible").toggle(); $(this).toggleClass("hided"); }); $(".option_box .attribute_group_name").click(function () { $(this).siblings(".attribute_box").toggle(); $(this).toggleClass("hided"); }); 

与之关联的HTML代码是：

 
 
Gama
 
 
 
 
Correcta
 
 
 
 
Aficionado
 
 
 
 
Entusiasta
 
 
 
 
Purista
 
 
 
 
Exclusive
 
 
  

哪个，在视觉上产生这个：

我的问题是我想要下拉（实际上是一个带有桌子的div元素）当我将鼠标移出它时关闭但是，正如你所看到的，它不是那么容易，因为它不是一个像我在开始时那样声明.mouseout事件的问题。

下拉列表由两部分组成，即“标题”和“正文”，当我放弃其中任何一个时，我希望整个下拉列表关闭，但到目前为止，没有运气。 我在jQuery中缺乏一些真正的知识（这里和那里只是一个简单的触摸，但暂时没什么了不起的），所以我很困惑。 我试过.mouseout，.mouseleave，.focusout和其他方法。

我甚至使用jQuery ++来使用.within方法，但我同样迷失了。 你们有没有人能指出我正确的方向？

Answer 1

据我所知：你想用mouseout折叠表。 你为什么不添加这样的东西：

 $(".collapsible").mouseleave(function() { $(".collapsible").hide(); }) 

不适合你吗？