跨域实现IFRAME自适应高度~续(终级)
发布日期:2021-09-08 15:09:19
浏览次数:8
分类:技术文章
本文共 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月28日 01时52分51秒
关于作者
喝酒易醉,品茶养心,人生如梦,品茶悟道,何以解忧?唯有杜康!
-- 愿君每日到此一游!
推荐文章
戳破针对「木兰」编程语言的拙劣谣言
2019-04-26
为「木兰」编程语言添加对中文命名标识符的支持
2019-04-26
悬赏万元,重现「木兰」编程语言编译器
2019-04-26
跳出编程语言本身看中文编程语言设计
2019-04-26
RPLY 入门例程中文化
2019-04-26
木兰编程语言入门教程之一——浅介
2019-04-26
木兰编程语言入门教程之二——控制走向
2019-04-26
基于「木兰」编译器,加十行代码实现 ∈ (属于集合)语法
2019-04-26
创建安卓键盘演示——“好不”
2019-04-26
木兰编程语言入门教程之三——函数和类型
2019-04-26
基于「木兰」逆向工程用 pyinstaller 生成可执行文件
2019-04-26
从微盟事件看商业数据公开化的必然趋势
2019-04-26
为新语言编写Visual Studio Code语法高亮插件
2019-04-26
手机编程环境初尝试-用AIDE开发Android应用
2019-04-26
Java关键字的汉化用词探讨
2019-04-26
程序员面试时用中文命名写白板代码的好处
2019-04-26
1992年日本对母语编程的可读性比较实验
2019-04-26
[转] 用python编写控制网络设备的自动化脚本3:启动
2019-04-26
扩展Python控制台实现中文反馈信息
2019-04-26
扩展Python控制台实现中文反馈信息之二-正则替换
2019-04-26