Tab标签样式页面中多iframe的高度自适应问题（50分重谢！）

最近做了一个包含多个iframe的页面，在每个Tab标签中放入一个frame，点击不同的标签时才会显示相应的iframe。
页面效果类似于这个样子：http://www.sharejs.com/code/windows/tab/index.html
现在的问题是：
每个iframe中的内容高度是不一样的。需要点击到不同的tab标签页时，相应的iframe能显示、且高度自适应。
目前，采用网上说的各种方法：
onload方法、javascript方法等，都只能实现第一个iframe页面的高度自适应，无法实现所有iframe高度自适应。在网上查了很多资料。 都无法解决。请高手帮忙。
非常感谢！
body中的代码如下：
<body><div align="center">
<div id="gallery">
<div class="on" title="Constable"><span>通知、留言</span></div>
<div class="off" title="JobAccept"><span>待接受的任务</span></div>
<div class="off" title="JobIng"><span>进行中的任务</span></div>
<div class="off" title="JobDelayed"><span>超期的任务</span></div>
<div class="off" title="JobDone"><span>待打分的任务</span></div>
<div class="off" title="JobScore"><span>已完成的任务</span></div>
</div><div id="Constable" class="show" align="left">
<iframe id=src1  name=src11 width=100%  frameborder=0 src="JobView.jsp?kind=已结束" ></iframe>
</div><div id="JobAccept" class="hide" align="left">
<iframe id=src2  name=src21 width=100%  frameborder=0 src="JobView.jsp?kind=等待接受" ></iframe>
</div><div id="JobIng" class="hide" align="left">
<iframe id=src3  name=src31 width=100%  frameborder=0 src="JobView.jsp?kind=期间" ></iframe>
</div><div id="JobDelayed" class="hide" align="left">
<iframe id=src4 name=src41 width=100%  frameborder=0 src="JobAdd.jsp" ></iframe>
</div><div id="JobDone" class="hide" align="left">
<iframe id=src5  name=src51 width=100%  frameborder=0  src="JobView.jsp?kind=已结束" ></iframe>
</div><div id="JobScore" class="hide" align="left">
<iframe id=src6  name=src61 width=100%  frameborder=0 src="JobView.jsp?kind=已结束" ></iframe>
</div></div></body>
用于控制iframe显示、隐藏的js代码如下：
onload = function() 
{
var e, i = 0;
while (e = document.getElementById('gallery').getElementsByTagName ('DIV') [i++]) 
{
if (e.className == 'on' || e.className == 'off') 
{
    e.onclick = function () 
    {
var getEls = document.getElementsByTagName('DIV');
for (var z=0; z<getEls.length; z++) 
{
getEls[z].className=getEls[z].className.replace('show', 'hide');
getEls[z].className=getEls[z].className.replace('on', 'off');
}
this.className = 'on';
var max = this.getAttribute('title');
document.getElementById(max).className = "show";

}
}
}
}

解决方案 »

  1.   


        function SetWinHeight(obj)
        {
        var win=obj;
        if (document.getElementById)
        {
            if (win && !window.opera)
            {
        if (win.contentDocument && win.contentDocument.body.offsetHeight){
            win.height = win.contentDocument.body.offsetHeight;}
        else if(win.Document && win.Document.body.scrollHeight){
            win.height = win.Document.body.scrollHeight;}
            }
        }
       }使用:
    <iframe id=src6  name=src61 width=100%  frameborder=0 src="JobView.jsp?kind=已结束"   onload="SetWinHeight(this);" > </iframe>