dh: 实现iframe 自适应高度的问题（初始化和动态加载数据的时候）

//ifarme的呈现方式
 function InitIframeHtml(url) {
    $('#workarea').html("<iframe src=" + url + " frameborder='0' scrolling='no' width='800'  id='adminFrame'></iframe>");
}

//注意高度不要设置。

　　

function iframeAutoHeight() {
    if (window.addEventListener)
        window.addEventListener("load", iframeAutoFit, false);
    else if (window.attachEvent)
        window.attachEvent("onload", iframeAutoFit);
    else
        window.onload = iframeAutoFit;
}

document.iframeAutoFit = iframeAutoFit; 

function iframeAutoFit() {
    if (window != parent) {
        var a = parent.document.getElementsByTagName("IFRAME");
        for (var i = 0; i < a.length; i++) {
            if (a[i].contentWindow == window) {
                a[i].style.height = '50px';
                var h1 = 0, h2 = 0;
                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 = h + "px";
            }
        }
    }
}

页面初始化的时候:

$().ready(function() {iframeAutoHeight();  });

动态加载数据的时候：

iframeAutoFit（）；

　　

 

 js 实现iframe 自适应高度 超级简单的方法：

parent.document.getElementById("adminFrame").style.height = document.body.scrollHeight + "px";

 

jquery 实现iframe 自适应高度 超级简单的方法，也不用写什么判断浏览器高度、宽度啥的。

下面的两种方法自选其一就行了。一个是放在和iframe同页面的，一个是放在test.html页面的。注意别放错地方了哦。 iframe代码，注意要写ID

jquery代码１： //注意：下面的代码是放在test.html调用 $(window.parent.document).find("#main").load(function(){ var main = $(window.parent.document).find("#main"); var thisheight = $(document).height()+30; main.height(thisheight); });

jquery代码２： //注意：下面的代码是放在和iframe同一个页面调用 $("#main").load(function(){ var mainheight = $(this).contents().find("body").height()+30; $(this).height(mainheight); });