Bootstrap多层模态框如何嵌套？
2 回答
回首忆惘然
TA贡献1847条经验 获得超11个赞
使用js去弹出第二个模态框
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<title>bootstrap模态框(modal)</title>
<link href="../../css/bootstrap.min.css" rel="stylesheet">
<script src="../../js/jquery-2.1.1.min.js"></script>
<script src="../../js/bootstrap.min.js"></script>
<!--jquery必须是1.9.0版本以上的
-->
<script>
$(function(){
$("#btn2").click(function(){
$("#show2").modal("show");
});
})
</script>
</head>
<body>
<div class="container ">
<h1 class="page-header">bootstrap模态框(modal)</h1>
<button class="btn btn-primary" data-toggle='modal' data-target='#show'>登陆</button>
<div class="modal fade " id='show' >
<div class="modal-dialog">
<div class="modal-content">
<button class="close" data-dismiss='modal'>×</button>
<h1 class="modal-title">一层模态框</h1>
<div class="modal-footer">
<button class="btn btn-primary" data-toggle='modal' id="btn2">再弹</button>
</div>
</div>
</div>
</div>
<div class="modal fade " id='show2'>
<div class="modal-dialog">
<div class="modal-content">
<button class="close" data-dismiss='modal'>×</button>
<h1 class="modal-title">二层模态框</h1>
<div class="modal-body">
12312312
</div>
<div class="modal-footer">
</div>
</div>
</div>
</div>
</div>
</body>
</html>
- 2 回答
- 0 关注
- 1501 浏览
添加回答
举报
0/150
提交
取消