首页 > 代码库 > iframe交互（一）父页面自动高度

iframe交互（一）父页面自动高度

2024-11-05 11:58:02   208人阅读

 

//父页面源码
<body style="border:1px solid red;width:200px;height:500px;" onl oad="IFrameResize()">
    <script>
        function IFrameResize() {
            //alert(this.document.body.scrollHeight); //弹出当前页面的高度 
            var obj = parent.document.getElementById("childFrame"); //取得父页面IFrame对象 
            //alert(obj.height); //弹出父页面中IFrame中设置的高度 
            obj.height = this.document.body.scrollHeight; //调整父页面中IFrame的高度为此页面的高度 
        }

    </script>
    <script type="text/javascript" src=http://www.mamicode.com/"./auto-height.js"></script>
</body>
//子页面源码
<body>
    <IFRAME border=0 marginWidth=0 frameSpacing=0 marginHeight=0 src=http://www.mamicode.com/"iframe.html" frameBorder=0 noResize scrolling="no" width=100%
        height=100% vspale="0" id="childFrame"></IFRAME>
    <!-- <iframe id="iframe" name="asd" src=http://www.mamicode.com/"iframe.html" onl oad="loadIframe(this)" height="100" frameborder="0" style="border:1px solid blue">
    </iframe> -->
    <script type="text/javascript">
        function loadIframe(doc) {
            console.log(doc.contentWindow.document);
        }
    </script>
</body>

 

注意：调试时注意是否是本地启动，还是基于代理服务器。本地启动会触发作用于问题导致错误

iframe交互（一）父页面自动高度


联系
我们