Question

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

我只想做的是当我鼠标悬停链接时，会弹出一个弹出窗口。然后我可以转到这个弹出窗口点击更多东西，如果我选择不这样做，它会在我搬出时关闭。

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

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

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

Answer 1

某些浏览器处理鼠标悬停在鼠标下的某些内容。

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

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

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

Answer 2

您正在使用jQuery，因此您不妨移过on*个属性，然后开始编写unobtrusive JavaScript。因此，请记住这一点，只需使用jQuery mouseleave事件而不是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

为什么要移动<a> within a <span> counted as onmouseout?</span></a>

2 个答案: