请选择 进入手机版 | 继续访问电脑版

01BIM社区

 找回密码
 立即注册

扫一扫,访问微社区

查看: 1821|回复: 3

postMessage发送数据

[复制链接]

155

主题

643

帖子

2531

积分

金牌会员

Rank: 6Rank: 6

积分
2531
发表于 2022-11-14 14:59:38 | 显示全部楼层 |阅读模式
<postMessage往不同窗口里面发送数据>
2022年11月14日

回复

使用道具 举报

155

主题

643

帖子

2531

积分

金牌会员

Rank: 6Rank: 6

积分
2531
 楼主| 发表于 2022-11-14 15:01:28 | 显示全部楼层
      一个页面通过iframe引入另外一个页面,页面之间如何通讯?两个页面就存在两个window,存在跨域。父子页面可以通过window.postMessage进行通讯。
      1、子页面使用window.postMessage通讯;
      2、父页面使用window.addEventListener("message", receiveMessage, false);实时接收子页面的数据。

回复 支持 反对

使用道具 举报

155

主题

643

帖子

2531

积分

金牌会员

Rank: 6Rank: 6

积分
2531
 楼主| 发表于 2022-11-14 15:03:10 | 显示全部楼层
<父窗口>

<iframe src="test2.html"></iframe>
<script>
    function receiveMessage(e) {
      alert(e.data);
    }
    window.addEventListener("message", receiveMessage, false);
</script>

回复 支持 反对

使用道具 举报

155

主题

643

帖子

2531

积分

金牌会员

Rank: 6Rank: 6

积分
2531
 楼主| 发表于 2022-11-14 15:05:15 | 显示全部楼层
<子窗口test2.html>

<input type="text" value="send" id="input" />
<input type="button" value="send" id="button" />
<script>
  document.getElementById('button').onclick = function () {
      top.postMessage(document.getElementById('input').value, '*');
  };
</script>


回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|小黑屋|01BIM社区 - 最专业的BIM技术交流平台 ( 渝ICP备15000873号 )

GMT+8, 2024-3-29 20:33 , Processed in 0.057503 second(s), 21 queries .

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.

快速回复 返回顶部 返回列表