当没有悬停在特定元素上时需要jQuery的帮助

Question

我有一个导航div（id是导航）我正在考虑编写一个代码，当我没有悬停在导航上时执行。有人可以解释一下，如何用jQuery实现这一点。

<ul id='navigation'>
    <li>a</li>
    <li>b</li>
    <li>c</li>
    <li>d</li>
</ul>

#navigation li{
 display:inline;
 float:left;   
    width:50px;
    border-right:1px solid black;
    padding:2px;
}

jQuery("#navigation").mouseout(function(){

   alert("hi"); 

});

现在使用此代码即使我从一个li移动到另一个mouseout函数也被调用。但是我希望每次从这个导航中调用它。

Answer 1

要在用户的鼠标离开并执行元素时执行某些操作，请使用mouseout event：

$('#navigation').mouseout(function() {
  alert("You left me! :'(");
});

如果您还想在首次加载页面时执行此操作，则还需要将其添加为ready event。

Answer 2

步骤1：创建一个等于true的布尔标志。

步骤2：将鼠标悬停功能添加到导航中。该函数应该使布尔标志等于false

步骤3：向导航添加mouseout功能。该函数应使布尔标志等于false

步骤4：在页面就绪事件结束时添加一个while（true）{}循环，在该循环中使用if语句检查boolean。在if语句中输入您需要的任何代码。确保在while循环结束时也有延迟。