jQuery/Bootstrap - Twitter的引導模式打開頁面加載？

Question

我正在使用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…</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> 

Answer 1

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

嘗試這種

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

Answer 2

事實上，調用$('#myModal').modal()告訴模式現在顯示而不是上點擊。您應該簡單地刪除那個呼叫。

如果對模式及其觸發器使用正確的標記，則根本不需要javascript調用。這是引導程序的重要功能之一 - 您將獲得動態行爲到靜態標記。

Answer 3

無需使用任何JavaScript，如果你不想讓你的模式在頁面加載只顯示使用下面的代碼在引導

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