使用Jquery将iframe大小调整为内容

Question

我正在尝试动态调整iframe的大小以适应其内容.为此,我有一段代码:

$("#IframeId").height($("#IframeId").contents().find("html").height());?

它不起作用.是因为跨域问题吗？我如何使它适合？请看看Fiddle:JsFiddle

ps我已经设置了链接的html和正文 height:100%;

Answer 1

您只需要在iframe load事件上应用代码,因此当时已知高度,代码如下:

$("#IframeId").load(function() {
    $(this).height( $(this).contents().find("body").height() );
});

看工作演示.这个演示适用于jsfiddle,因为我已将iframe网址设置为与jsfiddle结果iframe相同的域中的网址,即fiddle.jshell.net域.

更新:
@Youss:由于一个奇怪的原因你的页面看起来没有正确的身高,所以尝试使用主要元素的高度,如下所示:

$(document).ready(function() {
    $("#IframeId").load(function() {
            var h = $(this).contents().find("ul.jq-text").height();
            h += $(this).contents().find("#form1").height();
            $(this).height( h );
        });
});