3

我正在使用 Twitter Bootstrap 的 Modal 插件,一切正常,控制台没有显示任何 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…&lt;/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>

Javascript

真的很简单:P,

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

3 回答 3

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

试试这个

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

于 2012-12-12T04:26:05.090 回答
2

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

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

于 2014-01-11T21:15:46.783 回答
0

如果您不希望模态显示在页面加载中,则无需使用任何 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 -->
于 2014-01-21T09:46:22.150 回答