使iframe根据内容自动调整高度，而无需使用滚动条？[重复]

西门樱Eva2020-03-19

例如：

<iframe name="Stack" src="http://stackoverflow.com/" width="740"
        frameborder="0" scrolling="no" id="iframe"> ...
</iframe>

我希望它能够根据其中的内容调整高度，而无需使用滚动。

猴子JinJin2020/03/19 12:24:43

过去在为动态创建的iframe调用iframe.onload时遇到了问题，因此我采用了这种方法来设置iframe大小：

iFrame视图

var height = $("body").outerHeight();
parent.SetIFrameHeight(height);

主视图

SetIFrameHeight = function(height) {
    $("#iFrameWrapper").height(height);
}

（这仅在两个视图都在同一域中时才起作用）

斯丁Near2020/03/19 12:24:43

您可以使用该库，该库不仅可以正确地调整iframe的大小，还可以通过检测iframe内容的大小是否发生变化（通过定期检入setInterval或通过MutationObserver）并调整大小来将其保持在正确的大小。

它们也是React版本。

这适用于跨域和相同域的iframe。

Newest Answer