什么命令可以使iframe框架里的被引用页面宽高自适应框架宽高？

Posted 2023-05-01

并不是里页面高度自适是，而是外面的iframe高度自适应你引入的页面的高度。思路是js控制iframe自适应高度，因为iframe本身并不能自适应高度，只有写死高度才行，所以要用js判断整个页面内容的高度。
给你的代码:
<iframe allowtransparency="true" src="你要入引的页面.htm" id="defaulIframePage" name="defaulIframePage" frameborder="0" scrolling="no" width="100%" onload="defaulIframePageHeight()">

</iframe>

js部分:
function defaulIframePageHeight()

var ifm = document.getElementById("defaulIframePage");
var subWeb = document.frames ? document.frames["defaulIframePage"].document : ifm.contentDocument;
if (ifm != null && subWeb != null)

ifm.height = subWeb.body.scrollHeight;

参考技术A 这个框架最好不要用。 参考技术B 并不是里页面高度自适是，而是外面的iframe高度自适应你引入的页面的高度,明白吗？
给你的代码:
<iframe allowtransparency="true" src="你要入引的页面.htm" id="defaulIframePage" name="defaulIframePage" frameborder="0" scrolling="no" width="100%" onload="defaulIframePageHeight()"></iframe>

js部分:
function defaulIframePageHeight()
var ifm = document.getElementById("defaulIframePage");
var subWeb = document.frames ? document.frames["defaulIframePage"].document : ifm.contentDocument;
if (ifm != null && subWeb != null)
ifm.height = subWeb.body.scrollHeight;



思路是js控制iframe自适应高度，因为iframe本身并不能自适应高度，只有写死高度才行，所以要用js判断整个页面内容的高度。(你用我这个iframe试试,别忘引入js代码:))

希望帮到您!追问

谢谢，你还是没有按照我的意思来做啊
我的框架是固定宽度的
必须是被引用页面适应框架宽度，不可以像你现在这样，框架去适应被引用页面，明白吗？
否则页面就会出现问题所示的，展示不完整，需要动用滚动条。我不想要这个滚动条，对访客很不友好。
我的要求就是这样的，请不要改变我的要求
谢谢！

追答

js部分:
function defaulIframePageWidth()
var ifm = document.getElementById("defaulIframePage");
var subWeb = document.frames ? document.frames["defaulIframePage"].document : ifm.contentDocument;
if (ifm != null && subWeb != null)
ifm.width = subWeb.body.scrollWidth;



改了下你看下

追问

谢谢，我试试看

网站就用百度的

宽度是600PX

前台看是这样的效果

还是不行啊



追答

页面没引入吗？

追问

引入了，
我假定引入百度首页
但是显示出了，就不是完整的百度首页啊
连滚动条都没有了

追答

滚动条是去掉的，iframe里面scrolling="no"
你先把那个600px的宽度去了试下,先不要写死宽度!
或都外面套个div写死宽度，里面iframe不要写死宽度试下！

追问

把宽度改成auto了

代码是这样的



追答

auto还是不行是吗？把那个固定宽度去了呢？

追问

都不行啊

追答

抱歉帮不了你了，你自已再找找吧:)

iframe宽高自适应

iframe子页面结尾添加本script

 

iframe子页面结尾添加本script

<script type="text/javascript">
        function iframeAuto() {
            try {
                if (window != parent) {
                    //定位需要调整的frame框架（在父级窗口中查找）
                    var a = parent.document.getElementsByTagName("iframe");
                    for (var i = 0; i < a.length; i++) {
                        if (a[i].contentWindow == window) {
                            var h1 = 0, h2 = 0;
                            a[i].parentNode.style.height = a[i].offsetHeight + "px";
                            a[i].style.height = "10px"; //首先设置高度为10px,后面会修改
                            if (document.documentElement && document.documentElement.scrollHeight) {
                                h1 = document.documentElement.scrollHeight;
                            }
                            if (document.body) h2 = document.body.scrollHeight;
                            var h = Math.max(h1, h2); //取两者中的较大值
                            if (document.all) { h += 4; }
                            if (window.opera) { h += 1; }
                            //调整框架的大小
                            a[i].style.height = a[i].parentNode.style.height = h + "px";
                        }
                    }
                }
            }
            catch (ex) { }
        }
        //事件绑定的方法，支持IE5以上版本
        if (window.attachEvent) {
            window.attachEvent("onload", iframeAuto);
        }
        else if (window.addEventListener) {
            window.addEventListener(‘load‘, iframeAuto, false);
        }
   
    </script>