Bootstrap模式窗口不會關閉第二次，我打開它

Question

我想打開使用Bootstrap遠程模式窗口。打開模式的頁面有以下代碼。

<a class="test" href="" data-toggle="modal" data-target="#myModal">Test</a> 

<div class="modal-container"></div> 

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.test').click(function() { 
      $('.modal-container').load(url, function (result) { 
       $('#myModal').modal('show'); 
      }); 
     }); 
    }); 
</script> 

遠程頁面有以下代碼

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> 
<div class="modal-dialog" role="document"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
      <h4 class="modal-title" id="myModalLabel">Modal title</h4> 
     </div> 
     <div class="modal-body"> 
      ... remote 
     </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> 
</div> 

我已經是在第一時間進行模態的遠程調用它打開並正常關閉，但該問題，如果我想再次打開它，它不關閉。如果本地定義的模式（相同的代碼），它工作正常。

請幫

Answer 1

我認爲你必須關閉第一個div和改變角色屬性上

<div class="modal-dialog"> 

試試吧！

<div class="modal fade" id="myModal" role="dialog" aria-labelledby="myModalLabel"> 
 
    <div class="modal-dialog"> 
 
     <div class="modal-content"> 
 
      <div class="modal-header"> 
 
       <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
 
       <h4 class="modal-title" id="myModalLabel">Modal title</h4> 
 
      </div> 
 
      <div class="modal-body"> 
 
       ... remote 
 
      </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> 
 
    </div> 
 
</div>