html5 postMessage 消息传递问题
<script type="text/javascript">
$.fn.extend({
addEvent: function (type, handle, bool) {
var el, thisLen = this.length;
bool ? bool = bool : bool = false;
if (thisLen == ) {
el = this[]; //jquery对象转成 js对象
el.addEventListener ? el.addEventListener(type, handle, bool) :
el.attachEvent('on' + type, handle);
} else {
for (var i = ; i < thisLen; i++) {
el = this[i];
el.addEventListener ? el.addEventListener(type, handle, bool) :
el.attachEvent('on' + type, handle);
}
}
}
});
</script>
兼容IE 与Firefox浏览器
var messageInfo = new Object;
messageInfo.received = '/HumanResource/Employee/Index';
messageInfo.infoType = 'technical lead';
messageInfo.data = 'technical lead';
parent.postMessage(JSON.stringify(messageInfo), window.location);
子窗口向父窗口传递消息
$(window).addEvent('message', function (ev) {
var messageInfoJson = JSON.parse(ev.data);
var received = messageInfoJson.received;
if (received != '/Home/Index') {
console.log('转发消息');
$("iframe").each(function (i) {
console.log(ev.data);
console.log(messageInfoJson);
window.frames[i].postMessage(ev.data, window.location);
});
}
else {
alert('哦,Home index 我被点啦。。。' + messageInfo.data);
console.log('哦,Home index 我被点啦。。。');
console.log(ev);
}
}, false);
接受消息,如不需要自己处理,则转发消息给其他窗口
html5 postMessage 消息传递问题的更多相关文章
- 跨域问题实践总结!下( [HTML5] postMessage+服务器端(反向代理服务器+CORS Cross-Origin Resource Sharing))
4. [HTML5] postMessage 问题: 对于跨域问题,研究了一下html5的postMessage,写了代码测试了一下,感觉html5新功能就是好用啊.此文仅使用html5的新特性pos ...
- [转]html5: postMessage解决跨域和跨页面通信的问题
[转]html5: postMessage解决跨域和跨页面通信的问题 平时做web开发的时候关于消息传递,除了客户端与服务器传值,还有几个经常会遇到的问题: 多窗口之间消息传递(newWin = wi ...
- HTML5 postMessage 跨域交换数据
前言 之前简单讲解了利用script标签(jsonp)以及iframe标签(window.name.location.hash)来跨域交换数据,今天我们来学习一下HTML5的api,利用postMes ...
- HTML5 postMessage 和 onmessage API 具体应用
HTML5 postMessage 和 onmessage API 具体应用 随着 HTML5 的发展.了解并熟悉 HTML5 的 API 接口是很重要的.postMessage(send) 和 on ...
- html5 postMessage解决跨域、跨窗口消息传递
一些麻烦事儿 平时做web开发的时候关于消息传递,除了客户端与服务器传值还有几个经常会遇到的问题 1.页面和其打开的新窗口的数据传递 2.多窗口之间消息传递 3.页面与嵌套的iframe消息传递 4. ...
- html5 postMessage解决跨域、跨窗口消息传递[转载]
原文:http://www.cnblogs.com/dolphinX/p/3464056.html 一些麻烦事儿 平时做web开发的时候关于消息传递,除了客户端与服务器传值还有几个经常会遇到的问题 1 ...
- html5 postMessage解决跨域、跨窗口消息传递(转)
仅做学习使用,原文链接:http://www.cnblogs.com/dolphinX/p/3464056.html 一些麻烦事儿 平时做web开发的时候关于消息传递,除了客户端与服务器传值还有几个经 ...
- Html5 postMessage实现跨域消息传递
一.同源策略 要理解跨域,我们首先要知道什么是同源策略.百度百科上这样定义同源策略:同源策略(Same origin policy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略, ...
- postMessage 消息传递
点击查看demo 前言 web开发了,除了前台与服务器交换数据,还有可能前台页面间需要进行数据传递,比如窗口间,页面和嵌套的iframe间.这些问题之前都有解决办法,但是现在html5引入的messa ...
随机推荐
- Python基础知识详解 从入门到精通(七)类与对象
本篇主要是介绍python,内容可先看目录其他基础知识详解,欢迎查看本人的其他文章Python基础知识详解 从入门到精通(一)介绍Python基础知识详解 从入门到精通(二)基础Python基础知识详 ...
- springboot08(springmvc自动配置原理)
MVC WebMvcAutoConfiguration.java @ConditionalOnMissingBean(name = "viewResolver", value = ...
- AcWing 850. Dijkstra求最短路 II 堆优化版 优先队列 稀疏图
//稀疏图 点和边差不多 #include <cstring> #include <iostream> #include <algorithm> #include ...
- 【代码总结】Struts2 Action接受参数方式的对比
一.属性方式 1.Action中:对应表单参数的setter.getter 2.页面中 :Form中元素name取值属性名 <s:property value="属性名" ...
- EVE-NG镜像模板资源占用统计
转:http://www.emulatedlab.com/forum.php?mod=viewthread&tid=432&extra=page%3D1 EVE Image fold ...
- 【原】Harbor安装及使用
一.Harbor简介 Harbor是一个用于存储和分发Docker镜像的企业级私有Registry服务器. 二.Harbor安装 1.下载Harbor包 官网地址:https://github.com ...
- Go包
1. 导入包和init函数 init().main() 是 go 语言中的保留函数.我们可以在源码中,定义 init() 函数.此函数会在包被导入时执行,例如如果是在 main 中导入包,包中存在 i ...
- Error: Cannot find module 'webpack' 问题解决办法
这句话的意思是:没有找到webpack模块. 就算之前你装了webpack,那肯定是非全局安装 所以要全局安装 npm install --save-dev webpack 问题解决
- angular iframe 加载失效解决办法已经自适应高度
<iframe frameborder="0" id="iframe1"></iframe> $('#iframe1').attr('s ...
- Dubbo监控中心搭建-dubbo-monitor-simple的使用
场景 Dubbo环境搭建-管理控制台dubbo-admin实现服务监控: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/10362 ...