Question

我的网页中有一个iframe。在iframe中，人们可以单独导航（提交表单，我的帐户等）。这样做时，每个新iframe页面上的iframe大小都会发生变化。问题是我已将一个iframe ID设置为自动调整大小。另一个问题是，在加载一些iframe之后，例如注册表单，它有一些上传照片的选项，例如，选项单击时它会扩展iframe的长度，所以一般的自动尺寸不起作用 - 无论如何我的脚本可以处理这个 - 。我可以在所有iframe页面中插入iframe的脚本，但是父页面如何识别每个iframe以自动调整大小？

父页面中的代码（按ID自动调整单个iframe页面的大小）：

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

可以修改以上脚本，以便应用iframe中的任何iframe页面加载？

iframe脚本：

<script type="text/javascript">
var myHeight = 0;

setInterval(function(){
if(myHeight != document.body.scrollHeight){
    myHeight = document.body.scrollHeight;
    parent.alertsize(myHeight);
}
},500);
</script>

I帧：

<iframe id="myiframe" src="../../data/my-account" name="myiframe" width="100%" height="100%" scrolling="no" frameborder="0"></iframe>

Answer 1

您可以使用top来引用父框架，它将引用顶部窗口对象。

top.alertsize(myHeight)

 +-----------------------+
 | top                   |
 |                       |
 | +------------------+  |
 | | iframe           |  |
 | +------------------+  |
 |                       |
 | +------------------+  |
 | | iframe           |  |
 | +------------------+  |
 +-----------------------+

无论页面加载什么，自动调整iframe大小

1 个答案: