警告框（Alert）插件
警告框（Alert）消息大多是用来想终端用户显示诸如警告或确认消息的信息。使用警告框 （Alert）插件，您可以向所有的警告框消息添加可取消（dismiss）功能。
如果您想要单独引用该插件的功能，那么您需要引用 alert.js。或者，您可以引用 bootstrap.js 或压缩版的 bootstrap.min.js。
用法
您可以有以下两种方式启用警告框的可取消（dismissal）功能：
1.通过 data 属性：通过数据 API（Data API）添加可取消功能，只需要向关闭按钮添 加 data-dismiss="alert"，就会自动为警告框添加关闭功能。
<a class="close" data-dismiss="alert" href="#" aria-hidden="true">
×
</a> 2.通过 JavaScript：通过 JavaScript 添加可取消功能
$(".alert").alert() 方法
下面是一些警告框（Alert）插件中有用的方法：
如需在关闭时启用动画效果，请确保添加了 .fade 和 .in class。
事件
close.bs.alert：当调用 close 实例方法时立即触发该事件。
closed.bs.alert ：当警告框被关闭时触发该事件（将等待 CSS 过渡效果完成）
关闭后执行
$('#myalert').bind('close.bs.alert ', function () {
// 执行一些动作...
})
//关闭前执行
$('#myalert').bind('closed.bs.aler t', function () {
// 执行一些动作...
}) 代码实例
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>警告框（Alert）插件</title>
<!-- Bootstrap -->
<link rel="stylesheet" href="../css/bootstrap.min.css">
<script src="../js/jquery-1.11.1.min.js"></script>
<script src="../js/bootstrap.min.js"></script>
</head>
<body>
<div class="container" style="padding:50px;">
<div class="alert alert-success" id="alert-success">
<a href="#" class="close" data-dismiss="alert">×</a>
<strong>成功！</strong>恭喜你进入系统。
</div>
<div class="alert alert-warning">
<a href="#" class="close" data-dismiss="alert">×</a>
<strong>警告！</strong>您的网络连接有问题。
</div>
<div class="alert alert-info">
<a href="#" class="close" data-dismiss="alert">×</a>
<strong>信息！</strong>请登录系统。
</div>
<div class="alert alert-danger">
<a href="#" class="close" data-dismiss="alert">×</a>
<strong>危险！</strong>您确定要做此操作吗？
</div>
</div>
<button type="button" class="btn btn-default">全部关闭(Close)</button>
<script>
$(function(){
// $(".alert").alert();
$("button").click(function(){
//关闭所有警告框
$(".alert").alert("close");
})
//点击cless="alert-success"警告框执行点击前点击后事件
$("#alert-success").on("close.bs.alert",function(){
//点击警告框前执行的事件
//弹出提示，是否进行操作
if (!confirm("您确定要关闭此警告框吗？")){
return false;
}
}).on("closed.bs.alert",function(){
//点击警告框后执行的事件
console.log("closed.bs.alert");
})
})
</script>
</body>
</html>显示效果：
