Bootstrap every day must learn the warning box plug-in _javascript tips

Warning Boxes (alert) messages are mostly used to want the end user to display information such as a warning or acknowledgment message. Using the Warning box (alert) plug-in, you can add a dismiss feature to all warning box messages.

If you want to refer to the functionality of the plug-in separately, you need to refer to alert.js. Alternatively, as mentioned in the Bootstrap Plug-in Overview chapter, you can refer to the Bootstrap.js or compressed version of Bootstrap.min.js.

One, usage
You can enable the cancellation (dismissal) feature of the warning box in the following two ways:
1, through the Data property: Add the ability to cancel through the Data-dismiss= API, simply add "alert" to the Close button and automatically add a shutdown function to the warning box.

<a class= "Close" data-dismiss= "alert" href= "#" aria-hidden= "true" >
 x
</a>

2, through javascript: Add the ability to cancel through javascript:
$ (". Alert"). Alert ()

Second, simple examples

The warning box is the click-Hour information box.
1. Basic examples

<div class= "alert alert-warning" >     
 <button class= "Close" type= "button" data-dismiss= "alert" >   
 <span>x</span>      
 </button>      
 <p>       
 Warning: Your browser does not support!      
 </p>       

2, add fade effect

<div class= "alert alert-warning fade In" >
If you use JavaScript, you can replace data-dismiss= "alert."

JavaScript method

$ ('. Close '). In (' Click ', Function () {
 $ (' #alert '). Alert (' close ');
})

There are two types of events in the Alert plug-in:

event, other identical

$ (' #alert '). On (' Close.bs.alert ', function () {
 alert (') called when the Close method is triggered! ');
}); 

This series of tutorials is organized into: Bootstrap basic tutorials, welcome to click to learn.

If you want to further study, you can click here to learn, and then attach 3 wonderful topics:

Bootstrap Learning Course

Bootstrap Practical Course

Bootstrap Plugin Usage Tutorial

The above is the entire content of this article, I hope to learn bootstrap warning box plug-ins help.