Javascript 悬停后Jquery延迟不起作用

我对jQuery延迟有问题。我需要在5秒后添加一个类，所以我写了以下内容：

工作示例：

它第一次工作，但是当我第二次悬停时，悬停的类没有被添加，我不知道为什么

有人能帮我解决这个问题吗？

试着用

var tm;
$('#category #product_list .ajax_block_product').on('mouseover',function(){
    var that = $(this);
    tm = setTimeout(function(){
        that.find('.sl').show();
        that.find('.product_img_link img').hide();
        that.addClass('hovered');
    }, 500);
});

$('#category #product_list .ajax_block_product').on('mouseleave',function(){
    clearTimeout(tm);
    that.find('.sl').hide();
    that.find('.product_img_link img').show();
    that.removeClass('hovered');
}); 

---

如评论中所述，您需要将500更改为5000。100=100ms毫秒，而不是1秒。1秒=1000ms。

500毫秒不是5秒，你想先用5000这个包围住它，可以吗？是的，我应该用它包围住它吗？@folpy用$this代替$this怎么样？为什么你先包围这个，然后再包围下一个？任何用途？100=100毫秒。1000=1000ms=1s。

var tm;
$('#category #product_list .ajax_block_product').on('mouseover',function(){
    var that = $(this);
    tm = setTimeout(function(){
        that.find('.sl').show();
        that.find('.product_img_link img').hide();
        that.addClass('hovered');
    }, 500);
});

$('#category #product_list .ajax_block_product').on('mouseleave',function(){
    clearTimeout(tm);
    that.find('.sl').hide();
    that.find('.product_img_link img').show();
    that.removeClass('hovered');
});