从 iframe 内部关闭的 Bootstrap 3.3.1 模态弹出窗口答案

【问题标题】：Bootstrap 3.3.1 modal popup close from inside iframe从 iframe 内部关闭的 Bootstrap 3.3.1 模态弹出窗口
【发布时间】：2019-04-12 11:59:00
【问题描述】：

我有一个通过 jQuery 和引导程序的 iframe，我需要在 iframe 页面本身内添加一个关闭按钮，而不是从打开的弹出窗口中添加。

我尝试在 html 弹出页面中添加<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>，但它什么也没做。

这是带有外部close按钮的当前代码，以及bbc.com的示例页面链接：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://bootstrapdocs.com/v3.3.1/docs/dist/js/bootstrap.min.js"></script>
<link href="https://bootstrapdocs.com/v3.3.1/docs/dist/css/bootstrap.min.css" rel="stylesheet"/>
<button class="btn btn-primary" data-toggle="modal" data-target="#myModal">Popup page</button>

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="padding:0px">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
      </div>
      <div class="modal-body">
          <iframe src="https://bbc.com"  style="width:500px; height:500px;  max-width:100%; max-height:100%" frameborder="0" allowtransparency="true"></iframe>  
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>
    <!-- /.modal-content -->
  </div>
  <!-- /.modal-dialog -->
</div>
<!-- /.modal -->

我找到了this post，但不确定在当前情况下如何实现它。

【问题讨论】：

你的关闭按钮对我来说似乎工作正常......
感谢您的评论.. 我知道，我需要在 iframe 内的页面内添加相同的按钮.. 而不是页面外的按钮。（以上只是 bbc.com 的一个例子，但如果弹出链接在服务器内，我想在其中添加关闭按钮）。

标签： javascript jquery iframe popup bootstrap-modal

【解决方案1】：

你可以像这样添加按钮并为 iframe 提供一些 id 'blackout'。

<button type="button" class="btn btn-default" onclick="window.jQuery('#blackout').toggle('slow');">Open/Close</button>

【讨论】：

感谢您的回答，但我测试了它，它什么也没做。