加载新内容时调整iFrame的高度

我有一个iFrame，它包含在我的HTML中，并在页面加载时可用。 首次加载页面时，iFrame没有内容/ src。 我正在使用jQuery动态地将内容插入到iFrame中。 当用户点击我页面上的链接时，iFrame的内容会更新。 所有这些对我都有用。 但是，当加载新内容时，我正在努力调整iFrame的高度。 我在StackOverflow上尝试了几种解决方案但没有成功。 这是我的iFrame代码：

这是我的jQuery，它改变了我的iFrame里面的HTML：

emailOpened.find('#myframe').contents().find('body').html(email.body);

这对我有用。 我只需要我的iFrame根据被注入内容的高度调整其高度。 我对这部分的所有尝试都失败了。

任何帮助表示赞赏！

更新：

这是我的新HTML：

Answer 1

如果您需要移动支持并允许（用户）滚动iframe，请查看https://github.com/davidjbradshaw/iframe-resizer a作为插件解决方案，修复iOS和Android上的不同问题。

• 如何在移动safari中正确显示iFrame
• https://encrypted.google.com/search?q=iframe+resize+ios+issue

我不得不支持移动设备，并在经过几个小时的研究和测试后最终使用它。 我还使用提供的消息通道来回发送消息到内部文档。

Answer 2

更改html后直接调用此函数。

  function resizeIframe() { var newHeight = document.getElementById('myframe').contentDocument.body.scrollHeight; document.getElementById('myframe').style.height = parseInt(newHeight,10) + 10 + 'px'; }