1.         解决思路：通过中转页面的HASH值来获取跨域iframe高度

如图:

详细思路：简单来说就是在B页面里创建一个和A同域的iframe C，让C和A之间可以通讯，以把B的高度传过去。

那么怎么传过去呢？在A页面直接取frames[ b ].frames[c].location.hash，可以取到hash值。B页面加载完成后，获取到B页面的高度并设置frame c的hash值，A页面获取frame c的hash值即可，并根据hash值设置frame B的高度。

A,C页面为包含iframe方的页面，B为要嵌入的第三方页面。C页面可以为任意页面，只要不是404即可。

2.         页面代码

A页面代码：

<iframe src="http://www.test.com/test_b.html" id="third_iframe" name="third_iframe" scrolling="no" frameborder="0"></iframe>

<script language="javascript">

    $("#third_iframe").ready(function () {

        var SetAutoHeight = function () {

            try {

              setTimeout(function () { SetAutoHeight(); }, 200);

                var h = window.frames["third_iframe"].frames["frame_c"].location.hash.substring(1);

                if (!!h) {

                    $("#third_iframe").height(h);

                } 

     } catch (e) {

            }

        }

        SetAutoHeight();

    });

</script>

B页面代码：

<iframe id="frame_c" name="frame_c" src="http://www.test2.com/iframe.html" scrolling="no" frameborder="0"></iframe>

   

<script type="text/javascript">

    window.onload = function () {

        var height = document.body.scrollHeight || document.documentElement.scrollHeight;

        document.getElementById("frame_c").src = document.getElementById("frame_c").src + "#" + height;

    };

</script>

A,B页面代码放在body中即可，（注意：B页面iframe的name和ID一旦定好不可更改），C页面可以是网站的任意页面，保证能访问即可。

本文固定链接: http://www.webzhishi.com/iframe_heigh/ | web知识网