jQuery - 如果悬停超过5秒,则显示div

Question

我想显示一个div,如果我将一个元素悬停在一个元素上超过5秒,我已尝试在stackoverflow中发布一些解决方案,但它们都没有工作.

这是我的悬停功能没有超时

$('div.avatar-with-data, .q-item-avatar').hover(function(){
        $(this).find('div.user-data').fadeIn('fast');
    },function(){
        $(this).find('div.user-data').fadeOut('fast');
    });

UPDATE

没有答案可行,但如果我改变了

$(this).find('div.user-data').fadeIn('fast');

至

alert('shown');

然后它工作(不明白为什么,尝试改变fadeIn to show()但仍然没有运气).但我上面的悬停功能没有时间.

Answer 1

试试这个

var tOut;
$('div.avatar-with-data, .q-item-avatar').hover(function(){
    tOut = setTimeout(function(){
        $(this).find('div.user-data').fadeIn('fast');
    },5000);
},function(){
    clearTimeout(tOut);
    $(this).find('div.user-data').fadeOut('fast');
});