防止悬停触发事件两次

Question

我正试图在div悬停时发出警报。

http://jsfiddle.net/4RgTS/248/

我当前的代码是（对于名为'testdiv'的div）

$(document).ready(function() {
    $("#testdiv").hover(function() {
        alert('1');
    });
});

这可以显示警报，但是在下一次鼠标移动时，即使我没有在div上空盘旋，也会再次显示警报？

一如既往地谢谢，

Answer 1

您可以使用$.one事件来处理此问题：

$(document).ready(function() {
  $("#testdiv").one("mouseenter",
    function() {
      alert('1');
    });
});

#testdiv {background: #ccf;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<div id="testdiv">Hover Me!!!</div>

---

或者，如果我没有正确回答您的问题，您只需要使用mouseenter事件。

$(document).ready(function() {
  $("#testdiv").on("mouseenter",
    function() {
      alert('1');
    });
});

#testdiv {background: #ccf;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<div id="testdiv">Hover Me!!!</div>

Answer 2

这是因为如果只有一个处理函数传递给hover()，它将用于mouseenter和mouseleave事件。要获得所需的行为，请更改为仅使用mouseenter：

$("#testdiv").mouseenter(function () {
    alert('1');
});

Updated fiddle

Answer 3

我相信你只想要.mouseenter()事件：

$("#testdiv").mouseenter(function() {
      alert('1');
});

<强> Working Demo