Iframe页面根据内容改变页面高度

问题描述

jsp父级页面中有一个iframe，需要根据父级页面弹出框选中值改变iframe中的值，此时需要同步设置iframe的高度，防止iframe中出现滚动条。

实现方法

1. 初始化时后设置iframe高度；

<iframe src="" id="styleBomformKfover" height="0"></iframe>
$("#styleBomformKfover").attr("src","url");
styleBomformKfover=document.getElementById("styleBomformKfover");
styleBomformKfover.height=document.documentElement.clientHeight-200;
styleBomformKfover.width=document.documentElement.clientWidth-20;

2. 在iframe的子页面设置进行高度设置；

setTimeout(function () {
	height = document.body.scrollHeight;
	parent.setHeight(height);
}
,600);

此处根据实际情况设置延迟毫秒值，如果加载快可不设置；
设置完值后调用关闭页面方法
父页面方法

function setHeight(height) {
	var styleBomformKfover=document.getElementById("styleBomformKfover");
	styleBomformKfover.height=height+30;
}

3. 向父级页面传值；
   子页面调用

parent.checkSave(data);

父页面

function checkSave(temp) {
	console.log(temp)
}

4. 注意，不设置延时时会出现设置不了父级的iframe高度，延迟根据实际情况设置就行，不必要非得是600