如何使用 Twitter Bootstrap 自动关闭警报 [英] How to Automatically Close Alerts using Twitter Bootstrap

查看:38
本文介绍了如何使用 Twitter Bootstrap 自动关闭警报的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

有兴趣的可以在这里找到:http://getbootstrap.com/javascript/#alerts>

我的问题是这样的;在向用户显示警报后,我希望它在一段时间后消失.根据 twitter 的文档和我浏览过的代码,它看起来没有包含在内:

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

解决方案

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

$(".alert-message").alert();window.setTimeout(function() { $(".alert-message").alert('close'); }, 2000);

如果你想把它包装在一个漂亮的函数中,你可以这样做.

function createAutoClosingAlert(selector, delay) {var alert = $(selector).alert();window.setTimeout(function() { alert.alert('close') }, delay);}

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

createAutoClosingAlert(".alert-message", 2000);

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

I'm using twitter's bootstrap CSS framework (which is fantastic). For some messages to users I am displaying them using the alerts Javascript JS and CSS.

For those interested, it can be found here: http://getbootstrap.com/javascript/#alerts

My issue is this; after I've displayed an alert to a user I'd like it to just go away after some time interval. Based on twitter's docs and the code I've looked through it looks like this is not baked in:

  • My first question is a request for confirmation that this is indeed NOT baked into Bootstrap
  • Secondly, how can I achieve this behavior?

解决方案

Calling window.setTimeout(function, delay) will allow you to accomplish this. Here's an example that will automatically close the alert 2 seconds (or 2000 milliseconds) after it is displayed.

$(".alert-message").alert();
window.setTimeout(function() { $(".alert-message").alert('close'); }, 2000);

If you want to wrap it in a nifty function you could do this.

function createAutoClosingAlert(selector, delay) {
   var alert = $(selector).alert();
   window.setTimeout(function() { alert.alert('close') }, delay);
}

Then you could use it like so...

createAutoClosingAlert(".alert-message", 2000);

I am certain there are more elegant ways to accomplish this.

这篇关于如何使用 Twitter Bootstrap 自动关闭警报的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆