Bootstrap alert box
Box warning (Alert) message is mostly used to display information such as end users want a warning or confirmation message. Box with a warning (Alert) plug-in, you can add cancel (dismiss) function to all the warning message box.
usage
There are two ways you can enable a warning box to cancel (dismissal) function:
- Through data attribute: by adding data API (Data API) to cancel the function, only need to add a button to turn off data-dismiss = "alert",it will automatically add functionality to turn off the warning box.
<a class="close" data-dismiss="alert" href="#" aria-hidden="true"> & Times; </a>
- By JavaScript: adding cancel functionality through JavaScript:
$ ( ". Alert"). Alert ()
Examples
The following example demonstrates the use of a warning box (Alert) widget by data attribute usage.
Examples
try it"
The results are as follows:
Options
There are no options.
method
Here are some warning box (Alert) plug-in useful ways:
| 方法 | 描述 | 实例 |
|---|---|---|
| .alert() | 该方法让所有的警告框都带有关闭功能。 |
$('#identifier').alert();
|
| Close Method.alert('close') | 关闭所有的警告框。 |
$('#identifier').alert('close');
|
To enable animation when closed, make sure you add the.fade and .in class.
Examples
The following example demonstrates.alert () method:
Examples
try it"
You can see all the warning box are applied off feature turns off any warning box, the other remaining alert box will be closed.
event
The following table lists the warning box (Alert) plug-ins to be used in the event. These events can be used when the hook function.
| 事件 | 描述 | 实例 |
|---|---|---|
| close.bs.alert | 当调用close实例方法时立即触发该事件。 |
$('#myalert').bind('close.bs.alert', function () {
// 执行一些动作...
})
|
| closed.bs.alert | 当警告框被关闭时触发该事件（将等待 CSS 过渡效果完成）。 |
$('#myalert').bind('closed.bs.alert', function () {
// 执行一些动作...
})
|
Examples
The following example demonstrates event box warning (Alert) plug-in:
Examples
try it"
The results are as follows:
