jQuery/Bootstrap - Twitter Bootstrap Modal Opening On Page L

Question

我正在使用 Twitter Bootstrap 的模态插件，它一切正常，控制台没有显示 javascript 错误，但我的问题是它在页面加载时打开？我关闭了模态，然后可以重新打开它没有问题，但是当我重新加载页面时，它就会一直打开。这是我的标记

.HTML启动模式

<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-    labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-header">
  <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
  <h3 id="myModalLabel">Modal header</h3>
</div>
   <div class="modal-body">
     <p>One fine body…</p>
   </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
     <button class="btn btn-primary">Save changes</button>
   </div>
  </div>

爪哇语

非常简单，真的很:P，

 <script>
 $('#myModal').modal()  
 </script>

Answer 1

$('#myModal').modal('hide') 

试试这个

http://twitter.github.com/bootstrap/javascript.html#modals

Answer 2

实际上，调用$('#myModal').modal()会告诉模态立即显示而不是单击。您应该完全删除该调用。

如果对模态及其触发器使用正确的标记，则根本不需要 javascript 调用。这是引导的一大特点 - 您可以通过静态标记获得动态行为。

Answer 3

如果您不希望模态在页面加载中显示，则无需使用任何 javascript，只需使用以下代码在 Bootstrap 中创建一个简单的模态

   <!-- Button trigger modal -->
   <button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
     Launch demo modal
   </button>
   <!-- Modal -->
   <div class="modal fade" id="myModal" 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">
           <h1>Hello World!</h1>
         </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><!-- /.modal-content -->
     </div><!-- /.modal-dialog -->
   </div><!-- /.modal -->