根据内容不一致的高度计算调整 iFrame 大小

Resizing iFrame based on content inconsistent height calculation

本文关键字：计算高度计调整 iFrame 大小高度不一致更新时间：2023-09-26

我已经实现了上一篇文章中描述的解决方案根据内容调整 iframe 的大小，它几乎工作得很好，但不完全是。

我遇到的问题是，有时它会正确计算高度，有时它会计算得太短，内容会被砍掉。

我正在寻找一些可能导致这种情况的建议，因为其他人似乎都取得了成功。在我看来，如果高度计算不正确，那么计算可能是在所有数据从外部源加载到 iFrame 之前进行的。但这只是猜测，我绝不是JS专家。

我可以做些什么来确保在外部页面完成加载后完成计算？

几乎

不可能正确计算高度。我已经玩了很长时间了。我经历过的一件事是，如果你在 iframe 中有一个表单，并且表单中有一些错误处理事件。假设表单中有一个带有隐藏行等的表。然后，当错误出现时，随着行开始出现，表格会变得"更高"，因此高度范围现在再次不同。每当在 iframe 内完成回发时，都无法控制高度。我已经尝试了那里发布的每个解决方案，但无法正确计算。我必须估计"最高"高度并将其硬编码为该高度。

我希望问题是您需要检测iFrame中的内容何时更改，然后再次调整iFrame的大小。在现代浏览器中，您可以使用 mutationObserver 来执行此操作，但它在 IE10 中不起作用，因此您必须使用故障回复来解决此问题。

我写了一个小型库来照顾所有这些问题，并将保持iFrame的大小适合其内容。工作在现代浏览器和IE8更高

。

https://github.com/davidjbradshaw/iframe-resizer