的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（）不按預期工作

回答

相關問題