的setTimeout（）和remove（）不按预期工作

我有这样的功能：的setTimeout（）和remove（）不按预期工作

function flash(msg) { 
    var _id = $('#flash_notice__'); 
    if(_id.length > 0) { 
    _id.html(msg); 
    } else { 
    $('<div id="flash_notice__">'+ msg +'</div>').appendTo('body'); 
    //$('body').append('<div id="flash_notice__">'+ msg +'</div>'); 
    } 
    setTimeout(function(){ 
    _id.fadeOut(500, function(){ 
     $(this).remove(); //or _id.remove(); 
    }); 
    }, 2500); 
}

第一次（在刷新）消息（MSG）保持页面上，那么当闪光灯（）再次运行，效果很好。我认为，当_id存在.remove（）它正在工作，但是当创建消息时它仍然在屏幕上。我做错了什么？谢谢。

来源

2013-02-04 user2039290

你已经基本上回答了自己的问题：

我认为，_id时存在一个.remove（）它的工作，但如果是创建的消息，它仍然在屏幕上

如果你看看你的代码，变量_id只有当消息已经在屏幕上时才存在。在创建它的情况下，该变量没有指向任何东西：已经页面上

function flash(msg) { 
    var _id = $('#flash_notice__'); 
    if(_id.length > 0) { 
    _id.html(msg); 
    } else { 
    _id = $('<div id="flash_notice__">'+ msg +'</div>').appendTo('body'); 
    } 
    setTimeout(function(){ 
    _id.fadeOut(500, function(){ 
     $(this).remove(); //or _id.remove(); 
    }); 
    }, 2500); 
}

例与元素：

var _id = $('#flash_notice__'); 
... 
} else { 
    $('<div id="flash_notice__">'+ msg +'</div>').appendTo('body'); 
}

你的代码更改为http://jsfiddle.net/GyUhB/
示例网页上有没有元素：http://jsfiddle.net/GyUhB/1/

来源

2013-02-04 10:49:30 Jamiec

它的工作，谢谢，但我不明白。 'var _id = $（'＃flash_notice __'）;'在if条件之外......如果我保留我的代码，并用“$（'＃flash_notice__'）替换”_id.fadeOut（500，...）“ .fadeOut（500，...）“它工作得很好。 – user2039290

@ user2039290 - 在您在逻辑的“else”分支中创建元素之前，该行代码运行*。因此，当你稍后尝试使用变量'_id'时，它不会引用任何对象。 – Jamiec

-1

尝试：

function flash(msg) { 
    var _id = $('#flash_notice__'); 
    if(!_id.length) { 
    _id = $('<div id="flash_notice__">'+ msg +'</div>').appendTo('body'); 
    } else { 
    _id.html(msg).show(); 
    } 
    setTimeout(function(){ 
    _id.fadeOut(500, function(){ 
     $(this).hide(); 
    }); 
    }, 2500); 
}

注意：.hide()而不是.remove()，所以_flash_notice可用于下一次重用。否则，每次都会创建一个新的_flash_notice。

来源

2013-02-04 10:49:59

的setTimeout（）和remove（）不按预期工作

回答

相关问题