我有一个链接页面链接到我需要在Bootstrap模态DIV中打开的内部页面.问题是,在以这种方式加载内容时,似乎将最新版本的Bootstrap v3与jQuery v2.1.4结合使用是行不通的.我已经阅读了很多关于使用Bootstrap创建模态以及如何逐步淘汰远程内容的教程.但是必须离开才能使用jQuery,或者不是.
理论是,当你点击
<a class="" href="/log/viewslim?id=72" title="View" data-target="#myModal" data-toggle="modal">View 72</a>
Run Code Online (Sandbox Code Playgroud)
应该读取data-load-remote的内容并将其注入到class中modal-body
.
<div id="myModal" class="modal fade">
<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">Event</h4>
</div>
<div class="modal-body">
<p>Loading...</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
但是,当我用jQuery v2.1.4和BS v3.3 +尝试这个例子时,它所做的是打开一个带有灰色背景的模态窗口,但模态窗口的所有样式都消失了.这意味着它似乎只显示模态体div,但模态页眉div中的模态标题,漂亮的模态框架和底部按钮根本不显示.关闭该框的唯一方法是在模态框外单击.
我已经找到了关于如何以这种方式打开远程URL的示例,但它们都使用过时版本的bootstrap,而不是我正在使用的版本.请问有人可以解决这个问题吗?
jquery twitter-bootstrap bootstrap-modal twitter-bootstrap-3