如何关闭模式与按钮在远程内容？

Question

作为标题，如何使用远程内容中的按钮关闭模式？

这里是原始页面，index.html：

<a href="modal.html" data-toggle="modal" data-target="#testModal">open modal</a>
<div id="testModal" class="modal fade">
  <div class="modal-dialog">
    <!-- Modal content-->
    <div class="modal-content">

    </div>
  </div>
</div>

这是我想在模态中打开的页面，模态。html:

<p>Hi, I am a modal</p>
<button class="btn btn-primary">close</button>

<script type="text/javascript">
  $(function() {
    $("#closeModal").click(function() {
      // do something...(Ajax)
      $("#testModal").modal('hide');
    });
  });
</script>

我想要关闭按钮来关闭索引中的模式。html，但不使用数据。以下是Plunker中的完整示例：http://plnkr.co/edit/EGjtma?p=info

Answer 1

        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>

对任何函数都不做任何操作，因为它内置在Boostrap上

Answer 2

我检查了你的代码，我发现模态所做的就是绘制模态的全部内容。html文件，并将其放置在类名为“modal content”的div中

这很简单，你可以在模式中的close按钮中编写这段代码。html文件，这将允许您关闭模式

<button class="btn btn-primary" onclick="$('#testModal').hide()">close</button>

我也有一些笔记要给你

1. 您添加了许多脚本，我不确定您是否需要这些脚本
2. 您的代码包含一些Javascript错误，因此请检查浏览器控制台以修复这些错误
3. 不要在模式中重复JS/CSS包含。html，如果这些文件已经存在于主文件中，则无需再次添加它们