如何检测 iframe 调整大小？答案

【问题标题】：How do I detect iframe resize?如何检测 iframe 调整大小？
【发布时间】：2009-08-17 08:59:53
【问题描述】：

有没有办法检测我的 iframe 的内容是否发生了变化？

我的解决方法是我有一个循环，它不断检查它有效但效率不高的内容高度是否有另一种方法可以做到这一点？

【问题讨论】：

你的意思是内容改变了？刷新到另一个网址？表单元素更新了吗？如果两个页面的高度相同，不确定高度是否会对您有所帮助。此外，如果他们从另一个域加载页面，您将无法访问文档正文的高度？需要更多信息

【解决方案1】：

由于 iframe 的内容具有单独的 window 元素，您可以在 iframe 内部的脚本中执行此操作。

$(window).resize(function(){
  var object = $(this)
  // Use `object.height()` and `object.width()`.
});

您还可以使用$("#the_iframe")[0].contentWindow.window（或类似的东西）而不是window 从包含iframe 的范围内访问iframe 的window 对象。

【讨论】：

-1 - 不幸的是，这是不正确的。这只会在<iframe> 宽度发生变化时触发，而不是在 iframe 的内容发生变化时触发。据我所知，遗憾的是，唯一能注意到变化的方法是通过轮询:(

【解决方案2】：

      setInterval(function() {
                var ifm = document.getElementById("UIMain");
                var h = ifm.contentWindow.document.body.scrollHeight;
                ifm.height = h < 400 ? 400 : h;
          }, 800);

纯javascript就可以了。不需要jquery。

【讨论】：

【解决方案3】：

这解决了问题：

iframe 代码：

<body onload="parent.alertsize(document.body.scrollHeight);">

父页面：

<script>
function alertsize(pixels){
 pixels+=32;
document.getElementById('myiframe').style.height=pixels+"px";
}
</script>

【讨论】：