Question

        <script language="JavaScript">
        function autoResize(id){
            alert('check');
            var newheight;
            var newwidth;

            if(document.getElementById){
                newheight=document.getElementById(id).contentWindow.document .body.scrollHeight;
                newwidth=document.getElementById(id).contentWindow.document .body.scrollWidth;
            }
            alert(newheight);
            alert(newwidth);
            document.getElementById(id).height= (newheight) + "px";
            document.getElementById(id).width= (newwidth) + "px";
        }
        </script>

HTML：

            <iframe id="faq_iframe" src="http://www.google.com" width="100%" height="200px" scrolling="no" frameborder="0" marginheight="0" onload="javascript: autoResize('faq_iframe');"></iframe>

问题：我正在使用iframe来显示我的页面。我需要将iframe放到我的页面高度我该怎么做。

我曾尝试过以上代码

我通过firebug

得到了这个错误

Permission denied for <http://localhost> to get property Window.document from <http://www.google.co.in>.
[Break On This Error] newheight=document.getEleme...tWindow.document.body.scrollHeight;

如何使iframe符合iframe src中给出的页面高度

Answer 1

在你的情况下你不能。

如果此文档位于其他域中，则内容位于一个域上的iframe无法读取注入文档的任何属性（包括宽度和高度）。

There are several ways to achieve cross domain communication across iframes但它涉及iframe所居住的文档是一个自愿的参与者，使用有效的javascript来促进它。

Answer 2

由于跨域策略，您无法检索iframe的高度。为此目的创建服务器端代理。

Answer 3

function autoResize(id){
   moz=document.getElementById&&!document.all
   mozHeightOffset=20
   document.getElementById(id).height=window.frames[id].document.body.scrollHeight+(moz?mozHeightOffset:0);
}

此代码将根据内容调整iframe的高度。将这个函数称为iframe的onload。

Answer 4

我也一直在努力解决这个问题。我最终最终使用了postMessage（HTML5）。在这里查看示例：cross-domain iframe resizer?

Answer 5

试试这个，即使你想要也可以改变。这个例子使用jQuery。

$（'＃iframe'）。live（'mousemove'，function（event）{

var theFrame = $（this，parent.document.body）;

this.height（$（document.body）.height（） - 350）;
  }）;

使iframe适合其内容高度

5 个答案: