javascript - 淡出多个引导警报

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');

演示：小提琴

Answer 2

我认为这是因为$(this).remove();从 DOM 中删除了警报。您实际上可以只修改内容，而无需每次在 AJAX 调用后重新生成警报。