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开发基础01-字符串操作方法汇总
字符串 Python对字符串的处理内置了很多高效的函数,非常方便功能很强大. "hello world" 字符串七种常用功能: 连接和合并 + join 移除空白 strip 分 ...
- c语言用raw socket进行抓包
https://www.cnblogs.com/MrYuan/p/5215923.html https://blog.csdn.net/qq_41787205/article/details/8669 ...
- vue 对象数组中,相邻的且相同类型和内容的数据合并,重组新的数组对象
在项目中,有时候会遇到一些需求,比如行程安排,或者考勤状态.后台返回的获取是这一周的每一天的状态,但是我们前端需求显示就是要把相邻的且状态相同的数据进行合并,所以我们就要重新组合返回的数据.如下所示: ...
- vue移动端项目在手机上调试
1.电脑和手机要连同一个wifi 一定是复制无线网的IP,而不是以太网的IP 2.在你的电脑上查找无线网络的ipv4地址: 查找方法:windows+r 然后再输入框里输入cmd 回车 会出现这 ...
- ModelSerializer,序列化与反序列化整合
复习 """ 1.解析模块:全局局部配置 REST_FRAMEWORK = { # 全局解析类配置 'DEFAULT_PARSER_CLASSES': [ 'rest_f ...
- 欧拉降幂 (a^t)%c 模板
#include<bits/stdc++.h> using namespace std; typedef long long ll; ll a,c,p,mod; ]; ll phi(ll ...
- Re(正则表达式)库入门
一.正则表达式的概念 正则表达式 "一行胜千言" regular expression regex RE 是用来简洁表达一组字符串的表达式. 'PN' 'PYN' 'PYTN' & ...
- openstack自动化搭建脚本
Openstack平台部署+节点扩容 1)搭建脚本 #!/bin/bash #openstack私有云平台部署 #脚本使用前提:三台虚拟机openstack(ip地址:.11至少4G内存,100G硬盘 ...
- 在ios微信客户端遇到的坑,input等错位
1.判断移动端设备 // 处理iOS 微信客户端弹窗状态下调起输入法后关闭输入法页面元素错位解决办法 var ua = window.navigator.userAgent.toLowerCase() ...
- STM32F103之USART学习记录
1.USART的主要特性 1)名称:串行异步通信接口 2)全双工.异步通信 3)发送和接收速率最高可达4.5MBits/s 4)可编程数据长度8或9bits 5)可配置的停止位:支持1或2位停止位 6 ...