<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. Reinforcement Learning,微信公众号:DRL学习

    欢迎大家关注微信公众号:DRL学习,我们一起来学习强化学习和深度强化学习的算法及现状应用问题. 强化学习简单说就是学习如何最大化未来奖励的预期总和,以及agent学会在环境中做出的行动序列,其中随机状 ...

  2. html()和append()

    html()方法会替换原有内容,append() 方法在被选元素的结尾插入指定内容.prepend() 方法在被选元素的开头插入指定内容 appendChild() 方法向节点添加最后一个子节点.pr ...

  3. 初探日志分析常用的linux命令

    了解linux常用命令,有助于提升我们的生产力,提升工作效率,更快速地定位问题,当然也是为了更好地解决问题.这两天,趁着在家办公的时间,我把linux系统中常用的命令整理了一下,主要涉及到查找.查看, ...

  4. Django中csrf_token验证原理

    我多年没维护的博客园,有一篇初学Django时的笔记,记录了关于django-csrftoekn使用笔记,当时几乎是照抄官网的使用示例,后来工作全是用的flask.博客园也没有维护.直到我的博客收到了 ...

  5. P&R 3

    Floorplan: 要做好floorplan需要掌握哪些知识跟技能? 通常,遇到floorplan问题,大致的debug步骤跟方法有哪些? 如何衡量floorplan的QA? Floorplan是后 ...

  6. MBA 报考

      1. 作者:MBA薛老师链接:https://www.zhihu.com/question/277811289/answer/397083199来源:知乎著作权归作者所有.商业转载请联系作者获得授 ...

  7. 使用Docker搭建Spark集群(用于实现网站流量实时分析模块)

    上一篇使用Docker搭建了Hadoop的完全分布式:使用Docker搭建Hadoop集群(伪分布式与完全分布式),本次记录搭建spark集群,使用两者同时来实现之前一直未完成的项目:网站日志流量分析 ...

  8. Python实现一个桌面版的翻译工具【新手必学】

      Python 用了好长一段时间了,起初是基于对爬虫的兴趣而接触到的.随着不断的深入,慢慢的转了其它语言,毕竟工作机会真的太少了.很多技能长时间不去用,就会出现遗忘,也就有了整理一下,供初学者学习和 ...

  9. ant+jmeter 自动生成测试报告

    1,把Jmeter根目录/extras 下的ant-jmeter-xxx.jar拷贝到ant根目录/lib下 2, 修改Jmeter的bin目录下jmeter.properties文件的配置:jmet ...

  10. vue基础笔记

    目录 Vue 渐进式 JavaScript 框架 一.走进Vue 二.Vue实例 三.生命周期钩子 四.Vue指令 五.组件 六.Vue-CLI 项目搭建 Vue 渐进式 JavaScript 框架 ...