Question

我正在尝试创建一个Bootstrap模式，但是现在当我打开它时，它会从整个页面插入html并将其插入到我的模态中。我直接从w3schools复制了示例模态，我没有使用任何JQuery动态更新它或任何东西。

当隐藏模态时，html向我显示正确的结构：我的导航栏，内容，然后是具有正确模态内容的隐藏模态。当我展示模态时，一切都会变得混乱。导航栏存在相同的结构，然后是内容，然后是模态（不应该隐藏）。但是，这次在模态中是从页面的其余部分重复的html。第二个模态以及正确的模态内容被隐藏在重复的html内容中，但它也是隐藏的。结果是我看到了两个版本的正文内容，一个在另一个版本的前面。当我隐藏模态时，一切都恢复正常。

换句话说：

 <!-- Modal -->
 <div class="modal fade" id="myModal" role="dialog">
 <div class="modal-dialog">

  <!-- Modal content-->
  <div class="modal-content">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal">&times;</button>
      <h4 class="modal-title">Modal Header</h4>
    </div>
    <div class="modal-body">
      <p>Some text in the modal.</p>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    </div>
  </div>

</div>

不断改变：

<!-- Modal -->
<div class="modal fade" id="myModal" role="dialog">
 <meta></meta>
 <title></title>
 <script></script>
 <div class="navbar"></div>
 <div class="container"></div>

 <!-- Modal -->
 <div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog">

  <!-- Modal content-->
  <div class="modal-content">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal">&times;</button>
      <h4 class="modal-title">Modal Header</h4>
    </div>
    <div class="modal-body">
      <p>Some text in the modal.</p>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    </div>
  </div>

</div>

我还应该指出，它不会复制头部或身体等标签。当我希望它保持静态时，为什么模态div的内部完全被改变，这对我来说真的没有意义。感谢任何帮助，谢谢。

bootstrap modal错误内容

0 个答案: