zoukankan      html  css  js  c++  java
  • 跨域实现IFRAME自适应高度

    IFRMAE请求一个跨域时,而这个跨我们没有操作权限,我们只有加一个HTML文件的权限,如何实现自适应行高
    这需要一个中间页面iframe.html

    原理:通过改变top.location的hash值,来实现高级的自适应
    主页面内容:

    <iframe name="iframeid" id="iframeid" scrolling="no" width="1000" frameborder="0"
    onload
    ="iframeHeight()"></iframe>
    $("#iframeid").attr({ src: http://local.zzl.com/iframe.aspx?url= + 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
    ="" onload="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>
  • 相关阅读:
    题解 P3842 【[TJOI2007]线段】
    题解 CF1366A 【Shovels and Swords】
    题解 CF1391D
    题解 CF1374B 【Multiply by 2, divide by 6】
    CSP-J2020爆零记
    YbtOJ20025 放置石子
    YbtOJ20001 立方数差
    [仅供参考]W-RB的码风及要求
    [敲黑板]CSP考试策略
    [水沝淼㵘]向量水解
  • 原文地址:https://www.cnblogs.com/DoNetCShap/p/2287665.html
Copyright © 2011-2022 走看看