Question

我正在使用此脚本根据内容自动调整iframe的高度和宽度..

<script language="JavaScript">


function autoResize(id){
    var newheight;
    var newwidth;

    if(document.getElementById){
        newheight=document.getElementById(id).contentWindow.document .body.scrollHeight;
        newwidth=document.getElementById(id).contentWindow.document .body.scrollWidth;
    }

    document.getElementById(id).height= (newheight) + "px";
    document.getElementById(id).width= (newwidth) + "px";
}
</script>

此脚本在跨域服务器中不起作用..是否有其他方法？

Answer 1

我最近自己有这个问题。最后我用postMessage方法解决了它。

在iFrame中包含的文档中，我会检查它是否实际上是从iFrame运行。

function inIframe(){
    if(top != self){
         var contentHeight = $('#myIframeContent').height(); //Just this part I did with jQuery as I was sure that the document uses it
         postSize(contentHeight);
         }
    }

如果文档在iFrame中运行，请调用我们将调用postSize的函数。

function postSize(height){
     var target = parent.postMessage ? parent : (parent.document.postMessage ? parent.document : undefined);

    if(typeof target != "undefined" && document.body.scrollHeight){
        target.postMessage(height, "*");
        }
    }

将以下代码添加到包含iFrame

的文档中

function receiveSize(e){
    if(e.origin === "http://www.mywebsite.net"){
        var newHeight = e.data + 35;
        document.getElementById("myIframeID").style.height = newHeight + "px";
        }
    }

window.addEventListener("message", receiveSize, false);

不幸的是我不记得所有这些的确切来源，因为我在Stackoverflow上查看了很多不同的解决方案，但也有不同的网站。但这个解决方案对我有用。

其他人以前遇到过这个问题，我在这里发布了这个解决方案。它似乎对他也很好： Error: Permission denied to access property 'document'

干杯

iframe resize在javascript中不能跨域工作

1 个答案: