我没有写“themodal”(第一个)的<script>...</script>为什么点击按钮会弹出“themodal-link"(第二个)的内容?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>模态弹出窗的使用(三)</title>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
</head>
<body>
<!--下面是代码任务部分-->
<button class="btn btn-primary" type="button">点击我</button>
<div class="modal fade" id="themodal" tabindex="-1">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title">模态弹出窗标题</h4>
</div>
<div class="modal-body">
<p>模态弹出窗主体内容</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
<button type="button" class="btn btn-primary">保存</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<button class="btn btn-info" type="button">Check</button>
<div class="modal fade" id="themodal-link" tabindex="-1">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button class="close" type="button" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title">Blue Sky</h4>
</div>
<div class="modal-body">
<p>I Like Blue Sky!</p>
</div>
<div class="modal-footer">
<button class="btn btn-danger" type="button" data-dismiss="modal">关闭</button>
<button class="btn btn-success" type="button">保存</button>
</div>
</div>
</div>
</div>
<script src="http://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
<script src="http://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.js"></script>
<script>
$(function(){
$(".btn").click(function(){
$("#themodal-link").modal();
});
});
</script>
</body>
</html>