博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
设置跨域的iframe的高度
阅读量:6040 次
发布时间:2019-06-20

本文共 738 字,大约阅读时间需要 2 分钟。

原因

如下图,A域中有个B域的页面,但是B的页面的长度不确定,A无法去设置一个准确的高度。

PS:iframe高度设置auto是无效的

解决办法

 

如上图,

(1)在B页面中加一个A的代理页面的iframe

        PS:这最里面的A页面能调用最外层A页面的方法,而B页面是调用不了最外层A的(因为跨域的安全限制)。

(2)当B页面加载完成时,修改A的agent.html所在iframe里src。

setTimeout(function(){    var _height =  $("#vs-source").height();    var b_iframe = document.getElementById("crossdomain_agent_iframe");  //agent.html的iframe的id                             if( b_iframe ){                                                var src = b_iframe.src.split("#")[0] ;        src = src.split("?")[0] ;        b_iframe.src =src+"?"+new Date().getTime()+"#"+(b_height+(_height-1000));    } },200) ;

(3)agent.html代码调用最外层A页面代码设置B页面高度

agent.html代码如下:

frame agent

 弊端

1.B页面需要做修改,加一个iframe和主动设置一次。

   PS:很多时候B页面是第三方的页面,这也是没办法的,需要弄的

转载地址:http://ycrhx.baihongyu.com/

你可能感兴趣的文章
C++中构造函数详解
查看>>
数据库课程实习设计——酒店房间预订管理系统
查看>>
vue.js的模板渲染
查看>>
关于H5+css3的一些简单知识
查看>>
Google-Authenticator
查看>>
FOJ有奖月赛-2015年11月 Problem A
查看>>
电商网站中添加商品到购物车功能模块2017.12.8
查看>>
android 模拟器 hardWare 属性说明
查看>>
六款值得推荐的android(安卓)开源框架简介
查看>>
max_element( )
查看>>
CSS Grid 布局
查看>>
接口的幂等性
查看>>
java中的类
查看>>
android 自定义文字跑马灯 支持拖拽,按住停止滚动,自定义速度
查看>>
SpringMVC完成文件上传的基本步骤
查看>>
实例168 使用指针输出数组元素
查看>>
bind 与unbind
查看>>
CSS: Flexbox
查看>>
Python学习
查看>>
Java并发_volatile实现可见性但不保证原子性
查看>>