javascript - 淡出多个 Bootstrap 警报

Question

我遇到了一个问题，询问如何在 5 秒后淡出 Bootstrap 警报，答案是以下代码。问题是，它只工作一次，但是因为我有多个在 AJAX 调用后生成的警报，所以这不好。如何在每次触发警报时运行以下代码？

window.setTimeout(function() {
     $(".alert").fadeTo(500, 0).slideUp(500, function(){
          $(this).remove(); 
     });
}, 5000);

Answer 1

一种可能的解决方案是在显示警报后使用自定义事件 showalert 并在事件处理程序中删除警报

$(document).on('showalert', '.alert', function(){
    window.setTimeout($.proxy(function() {
        $(this).fadeTo(500, 0).slideUp(500, function(){
            $(this).remove(); 
        });
    }, this), 5000);
})  

和

$('<div class="alert alert-error">' + 'some message' + '</div>').appendTo('#result').trigger('showalert');

演示:Fiddle