码迷,mamicode.com
首页 > 其他好文 > 详细

前端模态对话框

时间:2017-09-25 00:58:14      阅读:203      评论:0      收藏:0      [点我收藏+]

标签:sheet   href   script   data-   dia   onclick   footer   click   div   

{% load staticfiles %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="/static/dist/css/bootstrap.css">
</head>
<body>

<button type="button" class="btn btn-primary btn-lg" onclick="handleshow();">
登陆
</button>

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
<script src={% static "dist/js/jquery-3.2.1.js" %}></script>
<script src={% static "dist/js/bootstrap.js" %}></script>
<script>
function handleshow() {
$(‘#myModal‘).modal("show");
}
</script>
</body>
</html>

前端模态对话框

标签:sheet   href   script   data-   dia   onclick   footer   click   div   

原文地址:http://www.cnblogs.com/tiantao36/p/7589323.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!