iframe页面自适应高度的问题,困扰了我很长时间,我一直在做web管理系统,而且都是使用iframe来做的。一直没有解决这个问题,只是让iframe出现滚动条。今天测试组对此提出疑问,无奈又得解决了。同事帮忙找来一篇文章,让我很是受益。http://ued.koubei.com/
这基本解决了自动适应高度的问题,但是,当从高的页面切换到矮页面的时候,取到的高度还是那个高的值的问题,即还是出现滚动条,感觉不是很完美,在此基础上,结合我们之前的项目。我将作者提供的代码进行了修改,如下:
//iframe自动适应浏览器高度
function reinitIframe(){
var iframe = document.getElementById("content");
try{
//iframe中文档的高度
var bHeight = iframe.contentWindow.document.body.scrollHeight;
//窗口中用户区域的高度
var page_height = document.body.clientHeight;
//header的高度
var head_height = document.getElementById('pageHead').clientHeight;
//foot的高度
var foot_height = document.getElementById('pageFoot').clientHeight;
//内容区域高度
var content_height = page_height - head_height - foot_height;
var height = Math.max(bHeight, content_height);
iframe.height = height;
}catch (ex){}
}
window.setInterval("reinitIframe()", 200);
希望对大家能有所帮助。