1

我在这里找到并使用了以下 stackoverflow 问题和答案。我正在使用 iFrame 内部的 iFrame 来引用父域，以便将我的身高传达给它。我完全理解这个概念，并且很容易实现。问题是，当我尝试从 jQuery 或仅通过 document.body.scrollHeight 获取 $(document).height() 时，当我的页面在 iFrame 内被引用时，我在所有浏览器中都看到了奇怪的结果。

这是我页面上发生的事情的一些背景。我正在做一些 ajax 调用来搜索第三方提供商的服务，并根据结果在我的页面内生成 html，这是非常标准的东西。顺便说一句，我正在等待将我的 html 添加到 DOM 中，然后再获取文档的高度。这是我的页面位于 iFrame 内时 $(document).height() 的结果。

FireFox 10.0.2，其中拾取的高度几乎比文档的实际高度小 1000 像素或更多。

Google Chrome 18.0.1025.162 在大多数情况下会选择正确的高度。有时高度仅小几百像素。

Safari 5 的行为也与 FireFox 一样。

我看过许多博客文章，其中包含显示行为的代码。我是否使用 jQuery 或 javascript 文档对象对我可用的东西都没有关系。我总是看到来自这些电话中的任何一个的结果不一致。我必须相信其他使用过这种技术的人也遇到过这种情况。

我不需要显示我的 iFrame 调整大小或辅助 iFrame 的代码，因为它们按预期运行。我要展示的主要代码是在 ajax 事件和 dom 操作完成后如何从搜索表单开始调整大小过程：

function resizeMe() {
    var iFrameHelper = $("#iFrameHelper");
    iFrameHelper.attr("src", iFrameHelper.attr("data-url") + "?height=" + $(document).height() + "&cacheb=" + Math.random());
}
4

1 回答 1

0

所以我最终弄清楚了问题所在。$(document).height() 部分工作正常。问题全在于时机。ajax 调用完成后我在页面中呈现的项目包含导致请求从页面发出以获取图像的图像。图像上没有设置默认高度，因此在我更改页面内 iFrame 上的 src 属性之前没有正确计算高度，这会启动父级的调整大小。

我最终做的只是默认我所有图像的高度，因为它们共享相同的尺寸。我责怪 iFrame 而不是我自己。2天因为这么简单的原因拔掉我的头发。

我希望这可以帮助其他人在未来。

于 2012-05-25T15:05:32.047 回答