iframe的父子层跨域 用了百度的postMessage()方法
父层:第一个是方法申明 第二个是接收子层过来的数据
<script type="text/javascript">
$("#main").load(function(){
window.frames[0].postMessage("getMessage","*");
window.addEventListener("message",function(e){
var height1=e.data;
$("#main").css("height",height1);
})
})
</script>
<script type="text/javascript">
window.frames[0].postMessage("getMessage2","*");
window.addEventListener("message",function(e){
var height1=e.data;
$("#main").css("height",height1);
})
</script>
子层:
<script type="text/javascript">
window.addEventListener('message', function(e) {
if(e.source != window.parent) return;
var height = $("body").height();
window.parent.postMessage(height, '*');
}, false);
</script>
最终让父层根据子层的高度自适应
iframe的父子层跨域 用了百度的postMessage()方法的更多相关文章
- [1.6W字]浏览器跨域请求的原理, 以及解决方法(可以纯前端实现) #flight.Archives011
Title/ 浏览器跨域(CrossOrigin)请求的原理, 以及解决方案详细指南 #flight.Archives011 序: 最近看到又有一波新的创作活动了, 官方给出的话题中有一个" ...
- ArcGIS API for Silverlight 调用WebService出现跨域访问报错的解决方法
原文:ArcGIS API for Silverlight 调用WebService出现跨域访问报错的解决方法 群里好几个朋友都提到过这样的问题,说他们在Silverlight中调用了WebServi ...
- Springboot中关于跨域问题的一种解决方法
前后端分离开发中,跨域问题是很常见的一种问题.本文主要是解决 springboot 项目跨域访问的一种方法,其他 javaweb 项目也可参考. 1.首先要了解什么是跨域 由于前后端分离开发中前端页面 ...
- AJAX跨域请求json数据的实现方法
这篇文章介绍了AJAX跨域请求json数据的实现方法,有需要的朋友可以参考一下 我们都知道,AJAX的一大限制是不允许跨域请求. 不过通过使用JSONP来实现.JSONP是一种通过脚本标记注入的方式, ...
- iframe中涉及父子页面跨域问题
什么是跨域? 跨域,指的是浏览器不能执行其他网站的脚本.它是由浏览器的同源策略造成的,是浏览器施加的安全限制.所谓同源是指相同的域名.协议和端口,只要其中一项不同就为跨域. 举几个例子: http:/ ...
- 利用 iframe解决ajax的跨域问题
问题 1. form提交或a标签跳转方式提交不会引发跨域问题. 2. ajax出于安全问题就有了跨域问题,因为一次请求中既访问了外部域最后返回了自己的域. 3. 用iframe其实就是想仿照ajax的 ...
- iframe与主框架跨域相互访问方法【转】
转自:http://blog.csdn.net/fdipzone/article/details/17619673 1.同域相互访问 假设A.html 与 b.html domain都是localho ...
- 计算机网络之iframe内联框架跨域
iframe框架同源下的数据调用 iframe框架非同源下的数据传输 一.iframe框架同源下的数据调用 1.父窗口向子窗口获取数据 //html1父级窗口 <iframe src=" ...
- iframe与主框架跨域相互访问方法
iframe 与主框架相互访问方法 http://blog.csdn.net/fdipzone/article/details/17619673/ 1.同域相互访问 假设A.html 与 b.htm ...
随机推荐
- 数据库引擎MyiSAM和InnoDB区别
数据库操作原理归根到底还是对文件操作,只不过是数据库文件. MySQL数据库引擎取决于MySQL在安装的时候是如何被编译的.要添加一个新的引擎,就必须重新编译MYSQL.在缺省情况下,MYSQL支持三 ...
- H5页面如何引入vConsole
vConsole github地址vConsole 是腾讯开源的项目,这就简单的介绍一下使用 使用npm引入vconsole.min.js下载 vConsole 的最新版本.(不要直接下载 dev 分 ...
- 史无前例的KDD 2014大会记
2014大会记" title="史无前例的KDD 2014大会记"> 作者:蒋朦 微软亚洲研究院实习生 创造多项纪录的KDD 2014 ACM SIGKDD 国际会 ...
- vue-cli多页面应用常遇到的问题
1.TypeError: webpack.optimize.OccurenceOrderPlugin is not a constructor 此问题出现在webpack 3中,解决办法很简单,将oc ...
- wabpack踩坑
webpack 打包时会用 NODE_ENV 来标识是生产环境还是开发环境光, "build": "NODE_ENV=production webpack", ...
- ES介绍与实践
一.ES介绍 1.基础概念介绍 1. 索引:Elasticsearch中的“索引”有点像关系数据库中的数据库. 它是存储/索引数据的地方: 2.分片 shard “分片”是Lucene的一个索引. 它 ...
- 马云也看好!VR在2016年能否得到质变
在2015年10月底有消息传出,国外虚拟现实公司Magic Lea的新一轮融资吸引到中国互联网巨鳄--阿里巴巴公司的关注.据透露,阿里巴巴极有可能为Magic Lea投资2亿美元.这虽然是阿里巴巴第一 ...
- Go基础学习(二)
数组[array] 数组定义[定义后长度不可变] 12 symbol := [...]string{USD: "$", EUR: "€", GBP: " ...
- Ubuntu 14.04 下NFS安装配置
1.执行命令:sudo apt-get install nfs-kernel-server; 2.执行命令:mkdir /home/jack/nfs-share 建立一个nfs服务的专有的文件夹; 3 ...
- 微软发布MS MARCO数据集,提高计算机阅读理解能力
MARCO数据集,提高计算机阅读理解能力" title="微软发布MS MARCO数据集,提高计算机阅读理解能力"> 本文译自:Microsoft data ...