如何使用Twitter Bootstrap自动关闭警报

Mar*_*tto 90 javascript css jquery alert twitter-bootstrap

我正在使用twitter的bootstrap CSS框架(非常棒).对于一些给用户的消息,我使用警报Javascript JS和CSS显示它们.

对于那些感兴趣的人,可以在这里找到:http://getbootstrap.com/javascript/#alerts

我的问题是这个; 在我向用户显示警报后,我希望它在一段时间间隔后消失.基于twitter的文档和我看过的代码看起来像是没有出现:

  • 我的第一个问题是要求确认这确实没有被引入Bootstrap
  • 其次,我该如何实现这种行为?

jes*_*vin 108

通话window.setTimeout(function, delay)将允许您完成此操作.这是一个示例,它将在显示后2秒(或2000毫秒)自动关闭警报.

$(".alert-message").alert();
window.setTimeout(function() { $(".alert-message").alert('close'); }, 2000);
Run Code Online (Sandbox Code Playgroud)

如果你想把它包装成一个漂亮的功能,你可以这样做.

function createAutoClosingAlert(selector, delay) {
   var alert = $(selector).alert();
   window.setTimeout(function() { alert.alert('close') }, delay);
}
Run Code Online (Sandbox Code Playgroud)

然后你可以像这样使用它......

createAutoClosingAlert(".alert-message", 2000);
Run Code Online (Sandbox Code Playgroud)

我确信有更优雅的方法来实现这一目标.


小智 99

我无法让它与警报一起工作.('关闭').

但是,我正在使用它,这是一种享受!警报将在5秒后消失,一旦消失,其下方的内容将滑动到其自然位置.

window.setTimeout(function() {
    $(".alert-message").fadeTo(500, 0).slideUp(500, function(){
        $(this).remove(); 
    });
}, 5000);
Run Code Online (Sandbox Code Playgroud)