Question

我们创建了一个网站，我们希望以缩略图的形式显示我们卡片的一些示例，但是当您点击它时，应该在模态窗口中显示更大的图片。现在本地（Windows机器）它完美，但一旦托管（Linux机器），模态的整个内容（标题，标记，图片，按钮）显示为一组奇怪的符号。

模态的代码：

＆＃13;

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

＆＃13;

The result of the hosted site

A part of the result:

由于不仅是图片而是整个模态都是这样显示的，所以看起来似乎不是编码问题。

任何帮助都非常感谢！

Answer 1

从href标记中删除<a>。我调试了bootstrap.js并发现，jQuery.load函数用于加载模态的内容。

看一看 http://getbootstrap.com/javascript/#modals-options

了解remote选项。

模态中的奇怪符号而不是内容

1 个答案: