远程内容更改引导模式窗口大小

Question

我有远程内容加载数据到 bootstrap3 模式。我无法弄清楚为什么当触发模态时，模态以全窗口大小而不是通常的正常大小（即宽度小于当前窗口）打开。

这是我的模态触发按钮：

{# ---- trigger button ---- #}
<a class="btn btn-xs btn-success" href="{% url "address_info" line_id %}" data-toggle="modal" data-target="#icontact">{% trans "Address" %}</a>

{# ---- modal ---- #}
<div class="modal fade" id="icontact" tabindex="-1" role="dialog" aria-labelledby="icontactModalLabel" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content"></div>
    </div>
</div>

远程 html ({% url "address_info" line_id %}) 是：

<div class="modal-content">
<div class="modal-header"> <h4 class="modal-title">Contact</h4></div>
<div class="modal-body">
    <table>
        <tr><th>Contact of&nbsp;&nbsp;</th> 
            <td> {{ line1 }}</td></tr>
        <tr><th>Email         </th> 
            <td>{{ email }} </td></tr>
    </table>
</div>
<div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">{% trans "Close" %}</button>
</div>

为什么使用远程内容时模态的大小会发生变化？而不是通过css或jquery强制模态大小......我认为一定有我想念的东西或者这是预期的行为？谢谢

Answer 1

我现在开始工作了。只需添加

<div class="modal-dialog"> 

在远程 html 的开头。这解决了这个问题。