JQuery懸停功能超時

Question

我在SO上看過其他類似的問題，但答案並不是我想要的。 我下面的代碼的問題是關於變量hide 。

在它的當前形式中，第一個懸停功能不會顯示隱藏 ，但我不想在更高的范圍內聲明它，因為它在那里沒有用處。 另外，在更高的范圍內聲明它需要為每個li制作一個不同的變量。

保持這個變量在這兩個函數之間包含超時的解決方案是什么？

$('li').hover(function() {
    clearTimeout(hide);
    $('.menu', this).show();
}, function() {
    var menu = $('.menu', this);
    var hide = setTimeout(function() {
        menu.hide();
    }, 500);
});

Answer 1

您可以使用.data()存儲該值

$('li').hover(function() {
    clearTimeout($(this).data('hide'));
    $('.menu', this).show();
}, function() {
    var menu = $('.menu', this);
    $(this).data('hide', setTimeout(function() {
        menu.hide();
    }, 500));
});