跨域实现IFRAME自适应高度~续(终级)
发布日期:2021-09-08 15:09:19
浏览次数:5
分类:技术文章
本文共 1256 字,大约阅读时间需要 4 分钟。
IFRMAE请求一个跨域时,而这个跨我们没有操作权限,我们只有加一个HTML文件的权限,如何实现自适应行高
这需要一个中间页面iframe.html原理:通过改变top.location的hash值,来实现高级的自适应
主页面内容: <iframe name="iframeid" id="iframeid" scrolling="no" width="1000" frameborder="0" οnlοad="iframeHeight()"></iframe> $("#iframeid").attr({ src: + cUrl });//自适应高度,不在同一域的对象,是不能相互操作的,只能通过URL地址把子页面的高度传过来
function iframeHeight() { var ifm = document.getElementById("iframeid"); var hash = window.location.hash.slice(1); if (hash && /height=/.test(hash)) { if (ifm != null) { ifm.height = hash.replace("height=", ""); } } setTimeout(iframeHeight, 200); }</script>
iframe.html内容(它向主页面通过hash这个瞄点参数向主页面传高度)
<iframe name="iframeid2" id="iframeid2" scrolling="no" width="1000" frameborder="0" src="" οnlοad="iFrameHeight()"></iframe><script type="text/javascript">
function iFrameHeight() { var ifm = document.getElementById("iframeid2"); var subWeb = document.frames ? document.frames["iframeid2"].document : ifm.contentDocument; if (ifm != null && subWeb != null) { ifm.height = subWeb.body.scrollHeight; // top.location.hash= "#height=" + subWeb.body.scrollHeight; //ie中显示没有权限 var hostUrl = document.referrer; hostUrl += "#height=" + subWeb.body.scrollHeight; window.top.location = hostUrl; } } </script>本文转自博客园张占岭(仓储大叔)的博客,原文链接:,如需转载请自行联系原博主。
转载地址:https://blog.csdn.net/weixin_34326429/article/details/90189574 如侵犯您的版权,请留言回复原文章的地址,我们会给您删除此文章,给您带来不便请您谅解!
发表评论
最新留言
路过按个爪印,很不错,赞一个!
[***.219.124.196]2024年03月16日 19时06分06秒
关于作者
喝酒易醉,品茶养心,人生如梦,品茶悟道,何以解忧?唯有杜康!
-- 愿君每日到此一游!
推荐文章
mysql 怎么字段分裂_你可以分裂/爆炸MySQL查询中的字段吗?
2019-04-21
全国省市区 mysql_2017全国省市区数据库【含三款数据库】
2019-04-21
mysql 怎样链接jdbc_jdbc怎么链接mysql数据库
2019-04-21
java exec封装_Java 执行系统命令工具类(commons-exec)
2019-04-21
mysql里可以用cube吗_sql server的cube操作符使用详解_mysql
2019-04-21
php mysql 图书_使用PHP+MySQL来对图书管理系统进行构建
2019-04-21
单片机c语言 int1,51单片机into、int1中断计数c语言源程序.doc
2019-04-21
c语言课程设计工资管理建库,C语言课程设计工资管理系统参考.doc
2019-04-21
c51写c语言外部ram头文件,C51中访问外部RAM的方法
2019-04-21
c语言打开一个html文件路径,C语言文件处理-C语言文件的打开和关闭
2019-04-21
普职融通信息技术课本C语言,“三步走”扎实推进“普职融通”办学新模式
2019-04-21
Android多个签名,【Android】Android批量重签名
2019-04-21
html unicode编码转换,JS实现的Unicode编码转换操作示例
2019-04-21