我真的是 Bootstrap 的新手,我正在尝试使用模式添加弹出窗口。我添加了代码和脚本,但是当您单击按钮时它不会弹出。我可以看出有什么东西要出现了,因为背景变淡了一点,但没有出现弹出窗口。所以我需要一点帮助来弄清楚为什么它没有弹出。
My JavaScript links:
<script src="js/jquery-1.10.2.js" type="text/javascript"></script>
<script src="js/bootstrap.min.js" type="text/javascript"></script>
Code for Modals:
<div class="modal hide fade" id="myModal">
<div class="modal-header">
<a class="close" data-dismiss="modal">×</a>
<h3>Modal header</h3>
</div>
<div class="modal-body">
<p>One fine body…</p>
</div>
<div class="modal-footer">
<a href="#" class="btn">Close</a>
<a href="#" class="btn btn-primary">Save changes</a>
</div>
</div>
<a class="btn" data-toggle="modal" href="#myModal" >Launch Modal</a>
最佳答案
这是 v2.X 与 v3.X 的兼容性问题
Bootstrap 3.0 新类和元素
Modal markup has changed
.modal-header
.modal-body
.modal-footer
now get wrapped in.modal-content
and.modal-dialog
模态迁移
如何从 2.x 模态转换为 3.0 模态:
- 从
.modal
中删除.hide
(现在默认隐藏) - 将
.modal-header
.modal-body
.modal-footer
包裹在.modal-content
- 将
.modal-content
包裹在.modal-dialog
中
事件是命名空间的。例如,要处理模式 'show'
事件,请使用 'show.bs.modal'
。
Bootstrap 3 模式示例:
<a data-toggle="modal" href="#myModal" class="btn btn-primary">Launch modal</a>
<div class="modal fade" id="myModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">Modal title</h4>
</div>
<div class="modal-body">
Content for the dialog / modal goes here.
</div>
<div class="modal-footer">
<a href="#" data-dismiss="modal" class="btn">Close</a>
<a href="#" class="btn btn-primary">Save changes</a>
</div>
</div>
</div>
</div>
关于javascript - Bootstrap 模态不弹出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28388524/