Bootstrap.js - 如何自动显示模态窗口？答案

【问题标题】：Bootstrap.js - how to automatically display a modal window?Bootstrap.js - 如何自动显示模态窗口？
【发布时间】：2012-02-21 03:42:39
【问题描述】：

我喜欢 Twitter 的 Bootstrap 库，我想尝试在我的简单页面中使用它。我需要在加载页面后自动显示the modal window。谁能给我一个提示，怎么可能呢？

【问题讨论】：

标签： javascript jquery twitter-bootstrap modal-dialog

【解决方案1】：

嗯，这不应该太难...做这样的事情：

jQuery(document).ready(function($) {
    $('#my-modal').modal(options)
});

【讨论】：

选项中有哪些可用的属性？
为此，亲爱的@DivpreetSingh，我想将您重定向到the manual

【解决方案2】：

页面准备就绪时加载此模式。

<body>
    <div id="top"> 
       <a tabindex="-1" href="#" id="metadata-link" data-target="#modal" data-toggle="modal">Metadata</a>
    </div>

   <div id="modal" class="modal hide fade in" style="display:none;">
      <div class="modal-header">header<a class="close" data-dismiss="modal">x</a></div>
      <div class="modal-body"></div>
      <div class="modal-footer">footer</div>
   </div>

<script>

    $(document).ready(function() {
        $('#top').find('a').trigger('click');

    });
</script>

最好的问候。

【讨论】：

【解决方案3】：

你的模态...

<div class="modal fade" id="formSaludo" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">

如果打开了 ulike modal... 使用 style="display: block;" 和 class="modal fade in"

<div class="modal fade in" id="formSaludo" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: block;">

【讨论】：