<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 消息传递问题的更多相关文章

  1. 跨域问题实践总结!下( [HTML5] postMessage+服务器端(反向代理服务器+CORS Cross-Origin Resource Sharing))

    4. [HTML5] postMessage 问题: 对于跨域问题,研究了一下html5的postMessage,写了代码测试了一下,感觉html5新功能就是好用啊.此文仅使用html5的新特性pos ...

  2. [转]html5: postMessage解决跨域和跨页面通信的问题

    [转]html5: postMessage解决跨域和跨页面通信的问题 平时做web开发的时候关于消息传递,除了客户端与服务器传值,还有几个经常会遇到的问题: 多窗口之间消息传递(newWin = wi ...

  3. HTML5 postMessage 跨域交换数据

    前言 之前简单讲解了利用script标签(jsonp)以及iframe标签(window.name.location.hash)来跨域交换数据,今天我们来学习一下HTML5的api,利用postMes ...

  4. HTML5 postMessage 和 onmessage API 具体应用

    HTML5 postMessage 和 onmessage API 具体应用 随着 HTML5 的发展.了解并熟悉 HTML5 的 API 接口是很重要的.postMessage(send) 和 on ...

  5. html5 postMessage解决跨域、跨窗口消息传递

    一些麻烦事儿 平时做web开发的时候关于消息传递,除了客户端与服务器传值还有几个经常会遇到的问题 1.页面和其打开的新窗口的数据传递 2.多窗口之间消息传递 3.页面与嵌套的iframe消息传递 4. ...

  6. html5 postMessage解决跨域、跨窗口消息传递[转载]

    原文:http://www.cnblogs.com/dolphinX/p/3464056.html 一些麻烦事儿 平时做web开发的时候关于消息传递,除了客户端与服务器传值还有几个经常会遇到的问题 1 ...

  7. html5 postMessage解决跨域、跨窗口消息传递(转)

    仅做学习使用,原文链接:http://www.cnblogs.com/dolphinX/p/3464056.html 一些麻烦事儿 平时做web开发的时候关于消息传递,除了客户端与服务器传值还有几个经 ...

  8. Html5 postMessage实现跨域消息传递

    一.同源策略 要理解跨域,我们首先要知道什么是同源策略.百度百科上这样定义同源策略:同源策略(Same origin policy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略, ...

  9. postMessage 消息传递

    点击查看demo 前言 web开发了,除了前台与服务器交换数据,还有可能前台页面间需要进行数据传递,比如窗口间,页面和嵌套的iframe间.这些问题之前都有解决办法,但是现在html5引入的messa ...

随机推荐

  1. web开发一些资源的在线引用地址

    <!-- Bootstrap --> <link rel="stylesheet" href="https://cdn.bootcss.com/boot ...

  2. RestTemplate-记录

    org.springframework.web.client.RestTemplate 1.从使用功能上看,是一种简化请求响应的工具类,从发送请求,到对返回的结果进行json解析.格式不对会有异常.

  3. 路飞-自定义User表和Media配置

    user模块User表 创建user模块 """ 前提:在 luffy 虚拟环境下 1.终端从项目根目录进入apps目录 >: cd luffyapi & ...

  4. springboot的安装与初步使用

    1.引用springboot框架 1.在maven项目底下的pom.xml的中,引用springboot,如下 <?xml version="1.0" encoding=&q ...

  5. 搭建分布式hadoop环境的前期准备---需要检查的几个点

    前期准备: jdkhostnamehostsdate安全机制firewallwindows 域名映射 具体的操作见下面 1.看看自己是否已经配置了别名了(linux别名的配置可以参考博文:自己cent ...

  6. 官方不再支持Python2,如何将你的项目完美迁移到Python3?

    Python 2.x 很快就要失去官方支持了,不过不用慌,从 Python 2 迁移到 Python 3 却并没有想象中那么难.我在上周用了一个晚上的时间将一个 3D 渲染器的前端代码及其对应的 Py ...

  7. vue中使用vue-i18n 一个简单的国际化操作

    1.安装:npm install vue-i18n --save-dev 2.在main.js文件中引入: import VueI18n from 'vue-i18n' Vue.use(VueI18n ...

  8. github提交代码

    下载git for windows,安装 第一步: 第二步: 第三步:不存在repository,点击 create a repository 第四步:切换至History菜单下,并点击publish ...

  9. 【PAT甲级】1078 Hashing (25 分)(哈希表二次探测法)

    题意: 输入两个正整数M和N(M<=10000,N<=M)表示哈希表的最大长度和插入的元素个数.如果M不是一个素数,把它变成大于M的最小素数,接着输入N个元素,输出它们在哈希表中的位置(从 ...

  10. Navicat连接远程主机(腾讯云服务器)的mysql失败,解决

    赋予所有用户远程连接的权限,重启mysql即可连接成功: grant all privileges on . to 'root'@'%' identified by 'admin'; systemct ...