jQuery .hover() 似乎在一段时间后“消失”

Posted 2023-05-09

【中文标题】jQuery .hover() 似乎在一段时间后“消失”

【英文标题】：jQuery .hover() seems to "disappear" after a while

【发布时间】：2011-09-08 21:51:06

【问题描述】：

$('img.questSign').hover( function()  
    $('img.questSign').attr('src', '/media/quest-sign-small-hover.png');
,
function()
    $('img.questSign').attr('src', '/media/quest-sign-small.png');
);

当页面重新加载时，这段代码的效果非常好。 但过了一会儿，它似乎停止工作。 图片在悬停时不会改变。

补充： 我对所有主流浏览器进行了长期测试，似乎这个非常特殊的问题只出现在新的 Firefox 5 beta 中。新的 Firefox 更新解决了问题

【问题讨论】：

您确定某些东西不会破坏您的脚本吗？当它停止工作时你会收到 JS 错误吗？代码对我来说看起来非常好。

我使用 Firefox 5beta 和标准的 webdev 工具。当窗口一段时间不活动时，也许我必须设置一个窗口间隔来更新事件....

【参考方案1】：

试试这个：

$('img.questSign').hover(function()  
    $(this).attr('src', '/media/quest-sign-small-hover.png');
, function() 
    $(this).attr('src', '/media/quest-sign-small.png');
);

您的旧代码会在页面上出现多个 img.questSigns 时出现异常。

【讨论】：

@daemonfire300：你是用$(document).ready包装它吗？

我当然愿意。该代码工作正常，但它只是在一段时间后停止工作。这真是奇怪的事情。

@daemonfire300：我想我们可能需要看现场演示。

【参考方案2】：

您可能希望使用这样的超时：

$('img.questSign').hover(function () 
    clearTimeout($(this).data('timeout'));
    $(this).attr('src', '/media/quest-sign-small-hover.png');
, function () 
    var e = $(this).data('timeout', setTimeout(function () 
        e.attr('src', '/media/quest-sign-small.png');
    , 3000)); // 3 sec
);

【讨论】：

是的，但是为什么要超时解决事件在一段时间后消失的问题。