如何自动调整 iFrame 的大小? [英] How to auto-size an iFrame?

问题描述

可能的重复:
根据内容调整 iframe 的大小

我正在加载 iFrame 并希望父级根据 iFrame 内容的高度自动更改高度.

I'm loading an iFrame and want the parent to automatically change the height based upon the height of the iFrame's content.

简单来说，所有页面都属于同一个域，所以我不应该遇到跨站点脚本问题.

To simply things, all pages belong to the same domain, so I shouldn't run into cross-site scripting issues.

推荐答案

在任何其他元素上，我会使用 DOM 对象的 scrollHeight 并相应地设置高度.我不知道这是否适用于 iframe(因为它们对所有东西都有些古怪)但它当然值得一试.

On any other element, I would use the scrollHeight of the DOM object and set the height accordingly. I don't know if this would work on an iframe (because they're a bit kooky about everything) but it's certainly worth a try.

环顾四周后，普遍的共识是使用 offsetHeight 从 iframe 内设置高度:

Having had a look around, the popular consensus is setting the height from within the iframe using the offsetHeight:

function setHeight() {
    parent.document.getElementById('the-iframe-id').style.height = document['body'].offsetHeight + 'px';
}

并附加它以与 iframe-body 的 onLoad 事件一起运行.

And attach that to run with the iframe-body's onLoad event.

这篇关于如何自动调整 iFrame 的大小?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！