Question

IFrame旨在根据其内容调整大小，并且适用于大多数浏览器，但仅适用于 Mozilla Firefox ，只有第一个加载工作正常但后续加载事件无效。

要让它再次运行，需要刷新页面或首先清除浏览器的缓存。

代码如下：

function sizeIFrame() {
var subscriptionFrame = jQuery("#subscriptionFrame");
var innerDoc = (subscriptionFrame.get(0).contentDocument) ?subscriptionFrame.get(0).contentDocument : subscriptionFrame.get(0).contentWindow.document;
subscriptionFrame.height(innerDoc.body.scrollHeight);   }

<iframe id="subscriptionFrame" onload="sizeIFrame();"></iframe>

有人对此有所了解吗？

Answer 1

你可能有一个DOM竞争条件，因为当页面加载时间较长（没有缓存）时它听起来很有效，而且一旦填充了缓存就没有。

尝试在load属性上使用jQuery的onload或事件。 jQuery在幕后处理特殊情况，因此它可能有所帮助。

<iframe id="subscriptionFrame" onload="sizeIFrame();"></iframe>
<script type="text/javascript">
$('#subscriptionFrame').load(function()
{
    var subscriptionFrame = this;
    var innerDoc = (this.contentDocument) ? this.contentDocument : this.contentWindow.document;
    $(this).height(innerDoc.body.scrollHeight);    
});
</style>

Answer 2

固定！解决方案如下：

function sizeIFrame() {
    var subscriptionFrame = jQuery("#subscriptionFrame");
    var innerDoc = (subscriptionFrame.get(0).contentDocument) ? subscriptionFrame.get(0).contentDocument : subscriptionFrame.get(0).contentWindow.document;
    if(innerDoc.body.scrollHeight==0)
        innerDoc.location.reload(true);
    subscriptionFrame.height(innerDoc.body.scrollHeight);   
}

这是因为Firefox从缓存而不是服务器加载iframe内容。因此xxx.location.reload（true）将强制从缓存加载iframe内容。希望它可以帮助你们！ =）

在Mozilla Firefox的第二次加载期间，iframe调整大小不起作用

2 个答案: