多个setTimeouts互相取消？

Question

当我打多个setTimeouts时,我有一个问题,当他们一个接一个地快速解雇时,他们似乎互相取消了.

鉴于这个小提琴:http://jsfiddle.net/72M6L/.

这显示了这个非常简单的对象:

fadepopup = function (msg) 
{
    $elm = $('<div class="fadepopup"></div>');
    $elm.html('msg');
    $('body').append($elm);

    setTimeout(function () 
    {
        $elm.fadeOut(500, function () 
        {
            $(this).remove()
        });
    }, 1500);
}

如果你按下按钮一次(在小提琴中),一切都很棒.
如果您快速按下按钮多次,则不会删除div.

为什么会发生这种情况,我该如何解决？

Answer 1

您正在使用全局变量$elm.在执行超时之前单击按钮时,变量已被覆盖,并且method($elm.fadeOut)不再绑定到该元素(因为变量引用了创建的最新元素).

我的建议是var在函数内使用它使其成为本地:

var $elm = $('<div class="fadepopup"></div>');

请参阅更新小提琴