javascript - 我怎样才能确保我的事件总是在 jQuery 中触发？ [悬停回调未触发]

Question

我有一个 BG 图像动画，它依赖于 hover 回调来恢复到它的原始状态。如果我将鼠标快速移动到链接上，悬停状态就会保持不变。我的猜测是我在第一个动画完成之前将鼠标移开，所以回调没有注册。

有没有更可靠的方法来编写这个函数？

$('.nav li a').hover(function() {
    $(this).addClass('hovered', 300);
}, function() {
    $(this).removeClass('hovered', 300);
});

(它使用 BGimg plugin 来支持添加/删除类的速度参数)

可在此处测试:McPherson Industries

Answer 1

这是一个常见问题，无法修复，恐怕 - 这取决于浏览器是否跟上事件，如果不能，那你就倒霉了。

不过，这也可能是 jQuery 的错。如果不深入研究源代码就很难说。无论如何，有一个简单的解决方法:

$('.nav li a').hover(function() {
    // When element is hovered, remove hovered state from all elements..
    $('.hovered').removeClass('hovered');
    // ..and add it to this one.
    $(this).addClass('hovered', 300);
}, function() {
    // This is only needed when exiting an element and not enterin another one
    $(this).removeClass('hovered', 300);
});

这可能不是 100% 确定，但比您现在的要好。