Bootstrap远程模态

时间:2014-02-07 03:49:42

标签: javascript jquery html twitter-bootstrap-3

我在从远程页面加载模态时遇到问题。内容未加载到模态中,而是加载到页面顶部。莫代尔甚至没有出现。为什么这不加载到模态中?

索引页

 <script>
$('#modal').modal({
    keyboard: false,
    remote: "second.html",
    show: false
})
</script>

<a data-toggle="modal" href="second.html" data-target="#modal" class="btn btn-primary btn-large">Load External Page</a>
<div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</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>

第二页

<p>TEXT GOES HERE</p>

截图:

enter image description here

1 个答案:

答案 0 :(得分:1)

如果你使用bootstrap 3.1,这是几天前推出的新版本,它们改变了远程模态行为。 尽管如此,他们没有更改文档。

从3.1版开始,远程模态的内容应该放在模态根中但是放在.modal-content div中

Bug on github exlaining the undocumented new feature