除了在Firefox中，下拉菜单闪烁

我有一个类似于这个问题的问题Drop Down Box保持闪烁 -当我将鼠标移到它上面时， JQuery和CSS下拉菜单闪烁，除了它似乎没有在firefox中发生。 我在鼠标输出事件中发出警报，发现每次我从菜单中的一个

到另一个时触发了警报。 这是它背后的html代码的重要部分。

  
  
  
 
 
/
 
 
  
 
 
 
Options...
 
 
 
 
  

如您所见，“account_container”div是下拉菜单。 当用户点击经过身份validation的帐户li时，它会首先出现，并在用户再次点击li或将其删除时消失。 导航div在css中将它的高度设置为40px，所以我认为它可能是一个定位问题，如链接问题，但将高度设置为auto无法修复它，我无法将帐户容器取出导航栏因为那会弄乱它的定位。 为什么浏览器检测到从一个菜单项转移到另一个菜单项作为mouseout事件，我该如何防止它？

编辑：

我可以做一些类似Andy E对这个问题的回答吗？ 我可以将onmouseout="hideAccount()"更改为onmouseout="hideAccount.call(this)"并检测鼠标是否在hideAccount函数内的下拉列表的子元素上？ 如果是这样，我该怎么做呢？ 作为参考，这是hideAccount函数：

 function hideAccount(){ //alert("mouse out!"); $(".account_container").hide(); } 

Answer 1

试试这个：

  function toggleAccount(e){ e.preventDefault(); $("#account_container").toggle(); } 

Answer 2

通过将hideAccount函数更改为：

 function hideAccount(event){ var to = event.relatedTarget || event.toElement; if(this.contains(to)){ return; } else{ $(this).hide(); } } 

问题是除了Firefox之外的每个浏览器都检测到从account_container移动到其中任何一个子节点作为mouseout。 从技术上讲，当鼠标位于容器内的一个列表元素上时，由于某种原因它不再位于容器本身之上。 我猜火狐是唯一一个在隐藏之前检查鼠标是否已移入子元素的浏览器。 修复它的原因是在javascript中检查我是否在尝试隐藏之前移动到子元素。