Firefox 在 iframe 中没有给出正确的高度

Question

此错误类似于：

jQuery 在 Firefox iframe 中报告不正确的元素高度

他返回的号码不正确。我的区别在于，当我的框架加载时 - 它给出零。

我试图将其内容的高度发送到父窗口。它在加载时不断发回零。如果我设置 50 毫秒的间隔，我会看到数字不断增加，直到达到正确的数字。零始终是间隔之前给出的第一个数字。

内部至少有一个元素具有预定义的高度 - 有些带有 css，有些带有内联。因此，如果元素仍在加载，则没有理由发送回零。

如果我 console.log $('#element')，该元素看起来是隐藏的（在最新版本中褪色）。如果我在 Chrome 中运行它，它会完美运行。我还尝试了本机 clientHeight，它也给出了 0，所以我不认为它是 jQuery。

编辑： 在我尝试计算高度之前，这些元素是通过 JS 添加的。它们在开始时不在页面上可能是一个问题..将尝试制作一个简单的演示页面来发布。

Firefox 4 beta 上不会发生这种情况

Answer 1

我知道这是一个老问题，但我在 Firefox 中遇到了类似的问题，iframe 预加载到 Bootstrap 模式中，最终显示时被截断。在那之前我无法计算出正确的高度，但我可以使用一些 jQuery 让它合理地无缝调整大小（对于最终用户）。我在这里回答，以防其他人继续寻找类似问题的解决方案：

$("#myIframe").load(function() {
  $m = $(".modal-body");
  var mh = $m.height();

  var wait = setInterval(function() {
    var ih = $("#myIframe").contents().find("body").height();
    if (ih == mh) {
      clearInterval(wait);
    } else if (ih > 0) {
      clearInterval(wait);
      $m.animate({ height: ih });
    }
  }, 50);

  $(".modal").modal("show");
});

这个想法是，当加载 iframe 时，如果浏览器计算出其高度为 0，则我会循环直到其报告的高度发生变化，然后平滑地设置容器尺寸的动画以适应。

Answer 2

iframe 在计算时是 display: none 因为我不想在一切设置完成之前显示它。因此，即使它在技术上是一个不同的窗口，它仍然认为元素的父元素不显示。

Answer 3

如果没有看到你的 HTML、jQuery 等，就很难确定。

我想说的是，当返回的高度似乎不准确时，我很幸运地使用了offsetHeight。你试过这个吗？

编辑：另一个想法：我过去注意到，在内容完全加载之前通过 JavaScript 访问 IFRAME 可能会出现问题。只是要记住一些事情。