3

jQuery在非 IE 浏览器上模拟 IE 的 mouseenter 事件。然而,在 IE 中,即使鼠标根本没有移动,也会在页面加载时触发 mouseenter(可能是由于 jQuerydoScroll在实现中的使用)。$.ready

这在其他浏览器中不会发生,并且绝对不遵循微软自己的规范,它说(强调我的):

仅当鼠标指针位于对象边界之外并且用户鼠标指针移动到对象边界内时,才会触发该事件。如果鼠标指针当前在对象的边界内,为了触发事件,用户必须将鼠标指针移到对象的边界之外,然后再移回到对象的边界内。

如果将悬停(或 hoverIntent 插件)应用于导航项以显示下拉菜单或“超级菜单”,这只会成为可用性问题:在 IE 中,mouseenter 将在 之后立即触发$.ready,用菜单遮挡内容。

4

2 回答 2

3

您可以在第一个 mousemove 事件上进行绑定,而不是在 DOM 就绪时进行绑定:

$(document).ready(function() {
    $(this).one('mousemove', function() { // only on the first time the mouse is moved
        $('#yourMenu').mouseenter(function() { // bind the mouseenter code
            // your code
        });
    });
});

这有点hacky,但我认为它应该工作。


我喜欢使用setTimeout. 另一种解决方案可能是改为进行绑定$(window).load()

$(window).load(function(){
    $('#yourMenu').mouseenter(function() { // bind the mouseenter code
        // your code
    });
});
于 2011-01-06T19:06:37.577 回答
1

我找到了一个可行的解决方案:在稍后的线程中进行绑定:

jQuery(function ($) {
    setTimeout(function () {
        /* bind with hoverIntent */
    }, 0);
});

在过去,这为我解决了很多 IE 问题(表单元素尚未准备好),因此 jQuery 应该将其烘焙到$.ready.

于 2011-01-06T22:30:30.997 回答