javascript - 为什么在一个算为onmouseout的范围内移动？

Question

我在这里创建了我的示例http://jsfiddle.net/Dgc5y/

我只想做的是，当我将鼠标悬停在链接上时，会出现一个弹出窗口。然后我可以转到此弹出窗口以单击更多内容，如果我选择不这样做，它会在我搬出时自行关闭。

问题是，当我移过此弹出窗口中的链接时，它会触发 mouseout 并自行关闭。

我最终使用了一些 hacky 修复（如示例中所示）

我想知道正确的方法，请帮助！谢谢！

Answer 1

一些浏览器将鼠标下方显示的内容处理为鼠标悬停。

（我有一个非常巧妙的东西，涉及一个想象图和一个小心放置的鼠标指针可以导致整个事情进入一个闪烁的循环。）

但是，我没有真正好的解决方案。我最终在 Javascript 中使用了信号量。当我的弹出窗口打开时，我设置了信号量，然后在mouseover其他元素的事件中，我检查信号量是否设置，如果是，我保释。

希望有人提供更好的解决方案——我可以使用它；）

Answer 2

您正在使用 jQuery，因此您不妨跳过on*属性，开始编写不显眼的 JavaScript。因此，请记住这一点，只需使用 jQuerymouseleave事件而不是mouseout事件。

HTML：

<div>
    <a class="trigger" href="#" >This is what you want</a>
    <span class="tooltip" id="popup2" >
        <a href="#">ZOMG it works</a>
    </span>
</div>

JavaScript

$('a.trigger').mouseenter(function () {
    $('#popup2').show();
});

$('span.tooltip').mouseleave(function () {
    $('#popup2').hide();
});​

http://jsfiddle.net/mattball/UwmhX

更多阅读：http ://www.quirksmode.org/js/events_mouse.html#mouseenter