Question

我在这里搜索过各处，但未能提出一个好的解决方案。我遇到了这个并且除了Firefox和IE之外它在每个浏览器中都有效:(帮助？

jQuery(function() {
    sizeIFrame();
    jQuery("#ifrm").load(sizeIFrame);
});

function sizeIFrame() { 
    var videoBrowser = jQuery("#ifrm");
    var innerDoc = videoBrowser.get(0).contentDocument ?
        videoBrowser.get(0).contentDocument.documentElement :
        videoBrowser.get(0).contentWindow.document.body;
    videoBrowser.height(35);
    videoBrowser.height(innerDoc.scrollHeight + 35);
}

并且它位于同一个域中，这是我的<iframe>

<iframe id="ifrm" src="http://localhost:8080/linkconsulting/temp.html" width="100%" frameborder="0" scrolling="no"></iframe>

我现在正在localhost进行测试，但以后它仍将在同一个域中。

更新：所以我注意到这不起作用，因为它似乎干扰了tiny.scrollbar插件或反之亦然。不知道该怎么做：（

Answer 1

我觉得这不起作用，因为在加载文档之前计算了高度。如果您在document.ready事件中调用sizeIFrame，则可能会有所不同。

在您的IFrame中尝试以下代码：

jQuery(function(){
   parent.sizeIFrame();
}

更新：根据我们的聊天，您可以使用以下内容获取IFrame中文档的高度：

parent.jQuery(document).height()

我想说将高度作为参数传递给你的函数。

Answer 2

你正在使用jQuery，尝试使用 iFrameAutoHeight plugin

Answer 3

我最后采取了不同的方法。我从iframe中获取了内容并将它们插入到div中。以下是其他人需要的代码。感谢大家的耐心和帮助。

<script>
function getFile(){

var content = jQuery('#servercontent')[0];

var ifrm = jQuery('#ifrm')[0];

content.innerHTML = ifrm.contentDocument.body.innerHTML;

}
</script>
<body>
 <div id="servercontent"></div>
 <iframe id="ifrm" src="webinsamedomain.com" width="100%" frameborder="0" scrolling="no" style="display:none;"  onload="getFile();" ></iframe>
</body>

iframe自动高度

3 个答案: