自动调整大小不起作用

Question

我有一个 iframe，这个 iframe 的内容发生了变化，所以 window 可以变大或变小，所以我添加了一个自动调整大小的脚本。

此脚本完美运行，但仅当内容变大时，如果内容发生变化并且比上次变小，window 不会调整大小并且高度相同。

不知道怎么回事。如果你有什么想法就好了。

还有我的脚本和 iframe:

function autoResize(id){
    var newheight;
    var newwidth;

    if(document.getElementById){
        newheight=document.getElementById(id).contentWindow.document.body.scrollHeight;
        newwidth=document.getElementById(id).contentWindow.document.body.scrollWidth;
    }

    document.getElementById(id).height=(newheight) + "px";
    document.getElementById(id).width=(newwidth) + "px"; 
}

$(function(){
    var f=$('#foo')
    f.load(function(){ 
        f.contents().find("body").on('click', function(event) { 
            runAfterTimeout('foo');
        });
    })
})
function runAfterTimeout(id) {
    setTimeout(function(){
        autoResize(id);
    },1000);
};

我的 iframe：

<iframe height="300px" width="100%" id="foo" src="" style="border: 0px currentColor; border-image: none;" onload="autoResize('foo')"></iframe>

Answer 1

我认为每次调用 onload 时您都需要重新设置 iframe 的高度。试试这个：

function autoResize(id){
    document.getElementById(id).height="0px";
    var newheight=document.getElementById(id).contentWindow.document.body.scrollHeight;
    var newwidth=document.getElementById(id).contentWindow.document.body.scrollWidth;

    document.getElementById(id).height=(newheight) + "px";
    document.getElementById(id).width=(newwidth) + "px"; 
}

自动调整大小不起作用

Auto Resize not working

javascript

iframe

jquery

autoresize

window-resize