Question

我已经阅读了大量的帖子和文章，并没有找到专门针对我的问题的修复

我的父网页通过iframe指向本地子网页。

子页面是一个php调查，当用户单击下一个按钮时，会在页面之间更改高度。（不是真正改变页面，而是在一个.php文件中重新填充内容）

我正在尝试让父页面自动展开，并根据子页面的长度联系高度。

我有这个特殊需求，因为我在WordPress中工作，并希望将一个PHP应用程序（调查）包含在WordPress主题的设计中。

我非常感谢你的帮助！

Answer 1

两个页面是否在同一个域中？如果是，那么实现这一目标的最简单方法是在父页面和子页面上运行JavaScript。

以下是关于它如何运作的粗略概念。在子页面上：

...
<script>
  function resizeFrame() {
    // Call out to the parent iframe.
    window.parent.resizeChild(document.body.clientHeight);
 }
</script>
...
<body onload="resizeFrame()">
...

在父页面上：

<script>
  function resizeChild(height) {
    // Add the ID of the iframe element below.
    document.getElementById(...).style.height = height + 'px';
  }
</script>

您可能需要调整高度，具体取决于iframe元素的边距/边框等。

如果这两个页面位于不同的域中，则会更加困难。 iframes之间的跨域通信很困难，特别是如果您想支持旧版浏览器。

尝试动态调整指向本地PHP页面的iframe高度

1 个答案: