Bootstrap模式不會激活

Question

我想創建一個Navbar按鈕，它調用一個包含表單的引導模式。我在https://gist.github.com/havvg/3226804發現了一個要點，我正在努力使其適應我的需求。我沒有完成填寫腳本的ajax部分，但我注意到模式沒有激活。我想按下導航欄上的按鈕並彈出模式窗體。我究竟做錯了什麼？

<div class="hide fade modal" id="rating-modal"> 
    <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal">button</button> 
     <h2>Your Review</h2> 

    </div> 
    <div class="modal-body"> 
     <!-- The async form to send and replace the modals content with its response --> 
     <form class="form-horizontal well" id="modalForm" data-async data-target="#rating-modal" action="AjaxUpdate/modal" method="POST"> 
      <fieldset> 
       <!-- Form Name --> 
       <legend>modalForm</legend <!-- Text input--> 
       <div class="control-group"> 
        <label class="control-label" for="old">Old password</label> 
        <div class="controls"> 
         <input id="old" name="old" type="text" placeholder="placeholder" class="input-xlarge"> 
         <p class="help-block">help</p> 
        </div> 
       </div> 
       <!-- Text input--> 
       <div class="control-group"> 
        <label class="control-label" for="new">New password</label> 
        <div class="controls"> 
         <input id="new" name="new" type="text" placeholder="placeholder" class="input-xlarge"> 
         <p class="help-block">help</p> 
        </div> 
       </div> 
      </fieldset> 
     </form> 
    </div> 
    <div class="modal-footer"> <a href="#" class="btn" data-dismiss="modal">Cancel</a> 

    </div> 
</div> 
<script src='js/jquery.js'></script> 
<script language="javascript" type="text/javascript"> 
$(document).ready(function() { 

    // $('form[data-async]').live('submit', function(event) { 
    $('#modalForm').on('submit', function (event) { 
     var $form = $(this); 
     var $target = $($form.attr('data-target')); 

     $.ajax({ 
      type: $form.attr('method'), 
      url: $form.attr('action'), 
      data: $form.serialize(), 

      success: function (data, status) { 
       $target.html(data); 
      } 
     }); 

     event.preventDefault(); 
    }); 

}); 
</script>  

Answer 1

嘗試從您的DIV去掉類hide：
<div class="fade modal" id="rating-modal">