iframe自适应高度的轻松实现(只需一个方法) 兼容IE6、IE7、fireFox
iframeAutoHeight.html
=============================
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<title>iframeAutoHeight</title>
<script type="text/javascript">
function iframeAutoHeight(obj)
{
var id = obj.id;
var subWeb = document.frames ? document.frames[id].document : obj.contentDocument;
if(obj != null && subWeb != null)
{
obj.height = subWeb.body.scrollHeight;
}
}
</script>
</head>
<body>
<table width="100%" border="1" cellspacing="0" cellpadding="0" bgcolor="#eeeeee">
<tr>
<td height="200" align="center">parent table</td>
</tr>
</table>
<iframe id="ifrID" frameBorder=0 scrolling=no src="iframe.html" width="100%" onload="iframeAutoHeight(this)"></iframe>
</body>
</html>
===========================================
嵌入的iframe.html
===========================================
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<title>iframe</title>
</head>
<body>
<table width="100%" border="1" cellspacing="1" cellpadding="1">
<tr>
<td height="200">table</td>
</tr>
</table>
<table width="100%" border="1" cellspacing="1" cellpadding="1">
<tr>
<td height="200">table</td>
</tr>
</table>
<table width="100%" border="1" cellspacing="1" cellpadding="1">
<tr>
<td height="200">table</td>
</tr>
</table>
<table width="100%" border="1" cellspacing="1" cellpadding="1">
<tr>
<td height="200">table</td>
</tr>
</table>
</body>
</html>
====================================
说明:
iframe 需要定义id 加入onload="iframeAutoHeight(this)"
页面中需要包含方法
function iframeAutoHeight(obj)
{
var id = obj.id;
var subWeb = document.frames ? document.frames[id].document : obj.contentDocument;
if(obj != null && subWeb != null)
{
obj.height = subWeb.body.scrollHeight;
}