0

問題の説明

私には2つの見方があります。最初のリンクにはリンクが含まれており、クリックすると、カスタムモーダルである2番目のビューが表示されます。両方のファイルは、schoolという同じフォルダーにあります。

コード

firstView.html

<html>
  <head>Click the link</head> 
  <body>
    <div>
    <a  data-toggle="modal" href="secondView.html" data-target="#secondView" >Additional Details</a>
   </div>
  </body> 
</html>

secondView.html

<!-- Modal -->
<div id="secondView" 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>

手元にある問題

問題は、リンクをクリックしても何も表示されないことです。コンソールを確認しましたが、エラーは表示されません。したがって、これはこれら2つのビューを接続する方法に関係していると思います。おそらく、hrefタグに関係していると思います。

皆様のご協力をよろしくお願いいたします。

4

1 に答える 1

1

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

リモートURLが提供されている場合、コンテンツはjQueryのloadメソッドを介して読み込まれ、.modal-bodyに挿入されます。

だからあなたはするだろう

firstView.html

<html>
  <head>Click the link</head> 
  <body>
    <div>
    <a data-toggle="modal" href="secondView.html" data-target="#myModal" >Additional Details</a>
   </div>

  <!-- Modal -->
  <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">
      <!-- Here be modal content -->
    </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>
  </body> 
</html>

secondView.html

<p>One fine body…&lt;/p>
于 2013-03-24T16:19:00.107 に答える