jquery iframe跨域动态高度答案

【问题标题】：Jquery iframe crossdomain dynamic heightjquery iframe跨域动态高度
【发布时间】：2023-03-29 22:25:01
【问题描述】：

只有 jquery 没有笨重的插件，这甚至可能吗？

我知道有很多插件和替代品，我正在寻找最短、最健壮和最干净的（最好依赖 jquery）

这里是基本的 jsfiddle 来尝试你的想法： http://jsfiddle.net/3vPJd/

【问题讨论】：

【解决方案1】：

我不得不选择“这是不可能的”，因为父页面无法获得第 3 方页面的高度，因为它来自与父页面不同的域。

编辑：如果您对第 3 方页面有一定的控制权，则可以执行此操作。

我个人会使用他们已经实现的方法，它不需要 jQuery，你只需要包含frame.js。

此时，您所需要的只是父页面上的一个方法，该方法可以侦听哈希何时更改并相应地调整 iframe 的大小，该方法也已由您链接的站点编写。它已经是一个非常干净的解决方案，不需要修改它。可以找到here。

【讨论】：

可能就像我说的，有多个例子。我正在寻找最小的“笨重”示例：css-tricks.com/examples/iFrameResize/…
见我上面的评论。该站点使用包含在 3rd 方站点上的脚本，这意味着您必须控制 3rd 方站点。如果是这种情况，那么可以，您只需将哈希添加到 window.top.location 并侦听父页面上的哈希更改。如果是这样的话，我可以提供一些非常简单的代码来完成它。
它需要一个 window.resize 的事件处理程序，这在没有 jQuery 的情况下应该是可能的。父页面只需要监听 hashChange 事件（并在不支持该事件的浏览器中实现相同的方法）并在哈希更改为预定值时调整 iframe 的大小。
我不这么认为，因为滚动条是您无法访问的窗口的一部分。
如果它属于不同的域，则会抛出 same-origin 和/或 access denied 错误。

【解决方案2】：

这个小图书馆会做你想做的事。它使用postMessage 在 iFrame 和父级之间进行通信，因此可以跨域工作。它还使用MutationObserver 和EventListeners 来检测内容的变化并保持iFrame 的大小正确。

【讨论】：