为了账号安全,请及时绑定邮箱和手机立即绑定

如何从另一个iFrame中清除iFrame的内容

如何从另一个iFrame中清除iFrame的内容

如何从另一个iFrame中清除iFrame的内容我wrapperPage.html和一个<iframe class="header"和<iframe class="pageBody"。在header有一个链接,<a class="clearLink"点击时应该清除内容pageBody。到目前为止,上述想法的以下实现不起作用。请帮我解决这个问题。请注意,header并且pageBody每个都从不同的包含文件加载。wrapperPage.html<div class=non-floater>     <iframe class="header" src="header.html"></iframe>     <iframe class="pageBody" src="pageBody.html" /> </div>header.html:<script type="text/javascript">     $(document).ready(function() {         $(".clearLink").on("click", function() {             $('.pageBody').contents().find("body").html('');         });     });</script><a class="clearLink" href="#">Navigation Button</a>pageBody.html:<div class="panel-body">This is the body</div>
查看完整描述

2 回答

?
墨色风雨

TA贡献1853条经验 获得超6个赞

尝试使用频道消息

wrapperPage.html

<body><div class=non-floater>
    <iframe class="header" src="header.html"></iframe>
    <iframe class="pageBody" src="pageBody.html" /> </div><script>
  var channel = new MessageChannel();
  var header = $(".header")[0].contentWindow;
  var pageBody = $(".pageBody")[0].contentWindow;
  header.onload = function() {
    this.postMessage("","*", [channel.port2])
  };

  channel.port1.onmessage = function(e) {
    if (e.data === "clicked") {
      $(pageBody.document.body).html("")
    }
  }</script></body>

header.html

<body><a class="clearLink" href="#">Navigation Button</a><script>
  var port;

  onmessage = function(e) {
    port = e.ports[0];
  }

  $(".clearLink").on("click", function(e) {
      port.postMessage("clicked");
  });</script></body>


查看完整回答
反对 回复 2019-08-23
?
回首忆惘然

TA贡献1847条经验 获得超11个赞

您可以从iFrame获取主窗口的引用,如下所示: Window.Parent引用

然后,您可以指定一个事件来捕获主窗口中的触发器或函数(或仅在其他iFrame中)来管理它。

例如 :

  • 在pageBody.html中编写与自定义事件关联的函数。

  • header.htmliFrame中的点击功能获取窗口参考。

  • 搜索已分配自定义事件的目标元素。

  • 点燃活动

我希望它可以帮到你。


查看完整回答
反对 回复 2019-08-23
  • 2 回答
  • 0 关注
  • 1169 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信