奇怪的setTimeout問題

Question

我有這個問題。 我定義了一個刪除鏈接的函數（僅為了示例），所以我希望在鏈接上的mouseleave事件之后，它會在5秒后消失（或者其他）。 此外，如果我將鼠標放在相同的鏈接上（表面上已經運行了setTimeout），則取消該setTimeout。 例如，以下代碼可以工作，但由於我沒有定義我的setTimeout，我無法取消它。

function func() { $('a').remove(); }
    //var interval = setTimeout( func , 5000);

    $('body').on('mouseleave', 'a', function() {
        setTimeout( func , 5000);
    });

    $('body').on('mouseenter', 'a', function(){
    //    clearTimeout(interval)
    });

相反，取消注釋第二行，使鏈接立即消失，即使我使用函數func沒有括號，所以我認為這不會是一個問題（ 小提琴 ）：

function func() { $('a').remove(); }
    var interval = setTimeout( func , 5000);

    $('body').on('mouseleave', 'a', function() {
        interval
    });

    $('body').on('mouseenter', 'a', function(){
    //    clearTimeout(interval)
    });

我該怎么做才能實現預期的功能？

謝謝！

Answer 1

你需要結合（是的，這是一個技術術語）你的兩次嘗試。 聲明func 和鼠標處理程序之外的interval ，以便兩個處理程序都可以引用它。

function func() {
    $('a').remove();
}

var interval;

$('body').on('mouseleave', 'a', function() {
    interval = setTimeout(func, 5000);
});

$('body').on('mouseenter', 'a', function() {
    clearTimeout(interval);
});​

http://jsfiddle.net/mattball/2XN9a/