淡出多个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');

演示:小提琴