方案1、
HTML
<!--内容部分--> <div class="con"> <iframe id="mainFrame" name="mainFrame" sr c="main.html" style="width:100%;" frameborder="0" scrolling="no" onLoad="this.height=100" ></iframe> </div>
写在同一页面上的JS
$(function () {
//时间控制每隔200毫秒检查当前页面高度以及滚动高度,测试多遍,cpu占用极少,不明显影响程序运行速度
window.setInterval("reinitIframe()", 200);
})
//iframe自适应高度,解决了动态更换页面高度无法自适应问题
function reinitIframe() {
var iframe = document.getElementById("mainFrame");
try {
//bHeight 和 dHeight 如果相等,用其一等于iframe.height 即可
// var bHeight = iframe.contentWindow.document.body.scrollHeight;
var dHeight = iframe.contentWindow.document.documentElement.scrollHeight;
// var height = Math.max(bHeight, dHeight);
console.log(dHeight)
iframe.height = dHeight;
} catch (ex) { }
}方案2、
html代码
<iframe id="iframe_id" name="iframe_id" src="加载的url" style="width: 100%;" frameborder="0" scrolling="no" onload="setHeight()"></iframe>
js代码
<script type="text/javascript">
function setHeight(){
var iframe = document.getElementById("iframe_id");
try{
var aHeight = iframe.contentWindow.document.body.scrollHeight;
var bHeight = iframe.contentWindow.document.documentElement.scrollHeight;
var height = Math.max(aHeight, bHeight);//取最高值;
iframe.height = height;
}catch (e){}
}
</script>总结:亲测可用
















18605917465
客服QQ