奇妙なシンボルがコンテンツの代わりにモーダルで表示

Question

カードの例をサムネイルとして表示するWebサイトを作成しましたが、クリックすると大きな画像がモーダルウィンドウに表示されます。ローカル（Windowsマシン）は完璧に動作しますが、いったんホストされると（Linuxマシン）、モーダルの全コンテンツ（タイトル、マークアップ、ピクチャ、ボタン）は奇妙なシンボルのセットとして表示されます。

モーダルのコード：

<div class="col-md-4"> 
 
    <a href="images/JUNO-FOTO-MW.png" class="thumbnail" data-toggle="modal" data-target="#ModalJUNO"> 
 
    <img src="images/JUNO-FOTO.gif" alt="geboortekaartje Juno" style="width:200px;height:200px"> 
 
    <p>geboortekaartje </br>Juno</p> 
 
    </a> 
 
</div> 
 
<!-- Modal --> 
 
<div id="ModalJUNO" class="modal fade" role="dialog"> 
 
    <div class="modal-dialog modal-lg"> 
 
    <!-- Modal content--> 
 
    <div class="modal-content"> 
 
     <div class="modal-header"> 
 
     <button type="button" class="close" data-dismiss="modal">&times;</button> 
 
     <h4 class="modal-title">Geboortekaartje Juno</h4> 
 
     </div> 
 
     <div class="modal-body"> 
 
     <img src="images/JUNO-FOTO-MW.gif" title="geboortekaartje Juno" alt="geboortekaartje Juno wil nu eventjes niet laden" width="850" height="850"> 
 
     </div> 
 
     <div class="modal-footer"> 
 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>

The result of the hosted site

A part of the result:

それは絵が、このように表示される全体モーダルではないだけであるので、それはエンコーディングの問題のようには思われません。

ご迷惑をおかけして申し訳ありません。

Answer 1

<a>タグからhrefを削除してください。 私はbootstrap.jsをデバッグし、jQuery.load関数を使ってモーダルのコンテンツを読み込むことがわかりました。

約remoteオプションを読む http://getbootstrap.com/javascript/#modals-options

を見てみましょう。