javascript - jQuery 鼠标事件处理

Question

我有以下代码:

HTML:

<div class="one">Content</div>
<div class="two">Content</div>

当第一个 div 发生 mosueleave 事件并且鼠标没有超过第二个 时，我想隐藏第二个 div >div。

算法:

if ((mouseleave from div.one) && (mouse not on div.two))
     hide (div.two);

如何使用 jquery 实现此代码片段？请帮我。

Answer 1

您可以在 .two div 上设置一个标志来跟踪鼠标悬停状态。然后，当鼠标离开 .one 时，您将检查此状态，如果存在，则隐藏该 div。就像这样:

$(".two").live("mouseenter", function(){
    $(this).data("hover", true);
}).live("mouseleave", function(){
    $(this).removeData("hover");
});

$(".one").live("mouseleave", function(){
  if( !$(".two").data("hover") ) $(".two").hide();
});