Question

我正在尝试根据iFrame中内容的大小更改iFrame的大小，挑战来自用户在iFrame中开始点击时，检查iFrame的状态我使用的是间隔像这样检查内容大小

var checkHeight = setInterval(function(){
checkHeight();
},1000);

function checkHeight() {
  var height = $('.foo').contents().height();
  console.log(height)
  $('.foo').css({
  'height': height + 'px'
  });
}

哪个好，当用户转到内容为600px的页面时，iFrame设置为600px，但是当用户转到高度为200px的页面时，iFrame会注销并设置600px，我无法弄清楚为什么jQuery会保存最高的高度数？在每个函数调用上将值设置为零会使页面变为bounch。

Answer 1

我正在使用类似的东西：

$(function(){
    $('#foo').load(function(){ 
        $('#foo').contents().find("body").on('click', function(event) { 
            runAfterTimeout('foo');
        });
    });
});

function runAfterTimeout(id) {
    setTimeout(function(){
        autoResize(id);
    },1000);
};

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"; 
}

在iframe上添加：onload =“autoResize（'foo'）”

jQuery检查iFrame高度并调整

1 个答案: