<!-- 这个是父页面xdm.html -->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>XDM通信</title>
</head>
<body>
<iframe id="iframeId" src="http://127.0.0.1:8020/avalon/iframe.html" width="100%" height="600px"></iframe>
<script type="text/javascript">
window.addEventListener('load' , function(){
var iframeWindow = document.getElementById('iframeId').contentWindow; iframeWindow.postMessage("滚犊子" , "http://127.0.0.1:8020/avalon/iframe.html");
});
</script>
</body>
</html>
<!-- 这个是子页面,iframe.html -->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body onload="aaaa()">
<script type="text/javascript">
function aaaa(){
window.addEventListener('message' , function(event){
console.log(event);
alert(event.data);
},false)
}
</script>
</body>
</html>

html5 xdm 页面之间的通信的更多相关文章

  1. 让微信小程序页面之间的通信不在变得困难

    一个开始 小程序开发者总会碰到各种页面之间的通信问题,实现方式也五花八门,比如... 场景还原 首先这是一个电商小程序. 有这样一个需求: 首页某个地方要展示购物车商品数量. 当我在其他页面加购了商品 ...

  2. iframe及与页面之间的通信

    获取iframe对象 iframe元素本身是位于父级页面中的,所以你可以像一个普通元素一样的使用和操作它 代表了iframe内容window对象是作为一个页面的属性加入到iframe中的, 为了让父级 ...

  3. js 页面间的通信

    看了一下公司原来的代码,原页面ajax post返回一个页面完整的HTML,然后再打开一个新页面并输出ajax返回的所有代码到新页面上,在新页面上以表单提交的形式实现重定向. 任凭我想了半天也没想出来 ...

  4. SSE两个页面的相互通信

    两个页面之间互相通信 首先搭建express框架,然后通过two页面发送数据给服务器,服务器把数据传送给one页面 在two 中发送数据,在one中显示 router/index.js var axi ...

  5. 【JavsScript】父子页面之间跨域通信的方法

    由于同源策略的限制,JavaScript跨域的问题,一直是一个比较棘手的问题,为了解决页面之间的跨域通信,大家煞费苦心,研究了各种跨域方案.之前也有小网同学分享过一篇“跨域,不再纠结” 开始照着尝试时 ...

  6. 【JavaScript】父子页面之间跨域通信的方法

    由于同源策略的限制,JavaScript跨域的问题,一直是一个比较棘手的问题,为了解决页面之间的跨域通信,大家煞费苦心,研究了各种跨域方案.之前也有小网同学分享过一篇“跨域,不再纠结” 开始照着尝试时 ...

  7. 萧墙HTML5手机发展之路(53)——jQueryMobile页面之间的参数传递

    基于单个页面模板HTTP通过路POST和GET请求传递参数.在多页模板,并且不需要server沟通,通常有三种方式在多页模板来实现页面之间的参数传递. 1.GET道路:上一页页生成参数并传递到下一个页 ...

  8. html5页面与android页面之间通过url传递参数

    html5页面与android页面之间可以通过url传递参数,android将参数放在htm5的url  ?后面,js获取url  ?号后面的参数. 方法一: <scrīpt> /* 用途 ...

  9. HTML5中window.postMessage,在两个页面之间的数据传递

    HTML5中window.postMessage,在两个页面之间的数据传递 2015年11月3日 8536次浏览 关于postMessage window.postMessage虽然说是html5的功 ...

随机推荐

  1. PDF 补丁丁 0.4.3.1342 测试版发布:修复崩溃问题

    PDF 补丁丁 0.4.3.1342 测试版发布了. 此测试版修复了之前测试版在合并文件.书签编辑器.文档结构探查器中出现的崩溃问题. 推荐下载了0.4.3测试版的网友尽快更新.

  2. dos2unix,去掉Linux下文件中的^M

    Windows系统下使用VS2010编写好的CPP文件,想放到Linux上进行编译.发现Linux上文件中的每行代码末尾都跟着^M这个符号. 为什么同一份文件在windows上和Linux上显示的不一 ...

  3. PHP批量删除做法

    1.批量删除主页 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://ww ...

  4. PHP 面向对象编程

    面向对象——类: 创建一个类: //创建了一个没有内容的Person(人)类 class Person{ } //通过new关键字来 实例化一个类 $teacher = new Person; //t ...

  5. Xcode5 取消ARC

    终于开心的装上Xcode5,主管马上发布新的任务,开始新的项目,各种开心,终于可以换个界面看看了. 可是谁知第一步创建项目就开始悲剧了,居然没有地方可以选择非ARC了,真是肿么个情况呀,查了一下,万能 ...

  6. [蟒蛇菜谱] Python方便使用的级联进度信息

    class StepedProgress: '''方便显示进度的级联进度信息. ''' def __init__(self, stockPercent=[1], parentProgress=None ...

  7. 2016 - 1 - 24 NSURLSession (一)

    一: NSURLSession简介 1.实施步骤 1.1 使用 NSURLSession对象 创建TASK ,然后执行TASK 2.TASK的类型: 二: NSURLSession的简单使用: - ( ...

  8. git merge 和 rebase 区别

    git pull  超级不推荐使用git pull 有坑,谨慎使用,pull底层是merge git pull 是 git fetch + git merge FETCH_HEAD 的缩写.所以,默认 ...

  9. Java连接mysql数据库

    1.先创建一个Java项目testMysql(我使用的是intellij编辑器). 2.导入mysql的驱动包. (1) (2) (4) 3.编写代码 import java.sql.Connecti ...

  10. 解决eclipse spring配置报错:cvc-elt.1: Cannot find the declaration of element

    解决eclipse spring配置报错:cvc-elt.1: Cannot find the declaration of element 'beans'.Referenced file conta ...