ブートストラップモーダルウィンドウが2回目に開くことがありません

Question

ブートストラップを使用してリモートモーダルウィンドウを開こうとしています。モーダルを開くページには次のコードがあります。

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

を持っている私が持っている問題は、モーダルがリモートで呼び出された最初の時間は、それが開き、正常に閉じていることですが、私がしたい場合はそれをもう一度開くと、閉じない。モーダル（同じコード）がローカルで定義されていればうまく動作します。

私はあなたが最初のdivを閉じて

<div class="modal-dialog"> 

にrole属性を変更しなければならないと思い

Answer 1

を助けてください、それを試してみてください！

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