您的位置:首页 > Web前端 > BootStrap

Bootstrap Dialog 使用

2016-07-14 00:00 429 查看
摘要: 先收藏,以后可能会用到

光是bootstrap.min.css 和bootstrap.min.js 还不够。因为Dialog 属于插件。还需要引入bootstrap-dialog.js 和bootstrap-dialog.css

前者到处都可以下载。后者网上不好找。找了半天nakupanda.github.io/bootstrap3-dialog/ 和

https://github.com/nakupanda/bootstrap3-dialog

这里两个地方可以下载到例子。里面包含了后面两个文件。然后具体怎么调用dialog就可以看这个网站:

http://nakupanda.github.io/bootstrap3-dialog/

下面是一个简单的例子:

<!DOCTYPE html>

<html>

<head>
<meta charset="utf-8" />
<title>Bootstrap 实例 - 标签页(Tab)插件</title>
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-dialog.css" rel="stylesheet" />
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/bootstrap-dialog.js"></script>
</head>

<body>
<a href="#" onclick="test()">测试按钮</a>

</body>

<script>
function test(){
BootstrapDialog.confirm('确认删除当前选中的记录吗?',
function(result){
if(result) {
BootstrapDialog.alert('I want 删除!');
} else {
BootstrapDialog.alert('I want 不删除!');
}
});
}
</script>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  Bootstrap Dialog