在页面加载时启动Bootstrap Modal

Question

我一点都不懂javascript。引导文档说通过javascript调用模式：$（'＃myModal'）。modal（options）我不知道如何在页面加载时调用它。使用引导页面上提供的代码，我可以在元素单击时成功调用Modal，但是我希望它在页面加载时立即加载。

Answer 1

只需将要在页面加载时调用的模式包装在load文档头部的jQuery 事件内，它就会弹出，如下所示：

JS

<script type="text/javascript">

    $(window).on('load',function(){

        $('#myModal').modal('show');

    });

</script>

的HTML

<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>

Answer 2

您不需要javascript显示模态

最简单的方法是将“隐藏”替换为“中”

class="modal fade hide"

所以

class="modal fade in"

并且您需要添加onclick = "$('.modal').hide()"按钮关闭；

PS：我认为最好的方法是添加jQuery脚本：

$('.modal').modal('show');