HTML5学习之跨文档传输消息(七)
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script>
window.onload = function() {
document.getElementById("btn").onclick = function() {
document.getElementById("f").contentWindow.postMessage(document.getElementById("t").value, "*");
};
};
</script>
</head>
<body>
<input id="t" type="text" />
<input id="btn" type="button" />
<iframe id="f" src="receiveMsg.html" ></iframe>
</body>
</html>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script type="text/javascript">
window.onmessage = function (event) {
//event.data 数据 event.origin 消息来源地址 event.source 源DOMWindow 对象
alert(event.data);
alert(event.origin);
alert(event.source);
}
</script>
</head>
<body> </body>
</html>
HTML5学习之跨文档传输消息(七)的更多相关文章
- HTML5中的跨文档消息传递
跨文档消息传送(cross-document messaging),有时候也简称为XDM,指的是来自不同域的页面间传递消息.例如,www.w3cmm.com域中的一个页面与一个位于内嵌框架中的p2p. ...
- HTML5 跨文档消息传输
对窗口对象的message事件进行监听 window.addEventListener("message", function(event) { // 处理程序代码 }, fals ...
- HTML5实战与剖析之跨文档消息传递(iframe传递信息)
在来自不同域名的页面间传递消息一般统称为跨文档消息传送,简称XDM.如,www.leemagnum.com域中的页面与位于一个内嵌框架中的http://blog.csdn.net/lee_magnum ...
- HTML5跨文档消息传递
HTML5定义了一些javascript API,其中有一个就是跨文档消息传递(cross-document-messaging简称XDM). 现在XDM已经作为一个规范独立了出来,名字为:Web M ...
- 通过Html5的postMessage和onMessage方法实现跨域跨文档请求访问
在项目中有应用到不同的子项目,通过不同的二级域名实现相互调用功能.其中一个功能是将播放器作为单独的二级域名的请求接口,其他项目必须根据该二级域名调用播放器.最近需要实现视频播放完毕后的事件触发,调用父 ...
- HTML(六)HTML iframe 使用postMessage方法进行跨文档消息传递
什么是iframe HTML内联框架元素 <iframe> 表示嵌套的浏览上下文,有效地将另一个HTML页面嵌入到当前页面中. <iframe id="inlineFram ...
- 跨文档消息传递----postMessage()
HTML5 规范中,提出了XDM,又称为 跨文档消息传递,其核心是 postMessage()方法,进行跨域和跨文档消息传递,示例如下: <div class="CrossDocume ...
- Web 通信技术 ——跨文档信息传输(JavaScript)
*/ * Copyright (c) 2016,烟台大学计算机与控制工程学院 * All rights reserved. * 文件名:text.html * 作者:常轩 * 微信公众号:Worldh ...
- web通信之跨文档通信 postMessage
index.html <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type&qu ...
随机推荐
- SQL手册
来自 W3School 的 SQL 快速参考.可以打印它,以备日常使用. SQL 语句 语句 语法 AND / OR SELECT column_name(s)FROM table_nameWHERE ...
- Unable to locate player settings. bin/Data/settings.xml
Hello guys, so according to the this response: http://stackoverflow.com/a/18302624/5727136 you need ...
- DICOM医学图像窗口变换的加速算法
详见:http://pan.baidu.com/s/1gfFLbJ9 DICOM医学图像窗口变换的加速算法* 张尤赛 ,陈福民 ( 同济大学计算中心, 上海 200092 ) (华东船舶工业学院电子与 ...
- 搭建JavaWeb服务器
JDK安装可以参考 http://www.cnblogs.com/a2211009/p/4265225.html Tomcat安装可参考 1.由于服务器配置比较低综合考虑,选择ubuntu系统进行搭建 ...
- struts2回显指定的错误信息
<s:fielderror /> 显示全部的 错误消息(用addFieldError方法添加的 ) <s:fielderror> <s:pa ...
- java.lang.ClassNotFoundException: net.sf.json.JSONArray,java.lang.NoClassDefFoundError: net/sf/json/JSONArray jetty跑项目遇到的问题
2016-05-18 15:44:25 ERROR Dispatcher.error[user:|url:]:L38 - Dispatcher initialization failed Unable ...
- 使用Django——安装
1. 安装 a) 安装python 在http://www.python.org/上下载python 2.7,然后安装,接着将python的安装路径(一般是C:\python27)添加到windows ...
- poj 2403
http://poj.org/problem?id=2403 题意:就是给你m个单词,以及n段对话.每一个单词都有所对应的价值.求对话中的价值总和 题解:很简单,就是用单词和价值对应起来,然后再寻找就 ...
- Qt 改变图片大小
void Setting_TabProduct::changeImageSize(int width,int height,QString imgFile) { QPixmap pixmap(imgF ...
- 14. javacript高级程序设计-表单
1. 表单脚本 1.1 基础知识 <from>元素表示表单: l acceptCharset:服务器能处理的字符集 l action:接受请求的URL l elements:表单中所有控件 ...