1、问题描述:我在网上找了一段JS代码动态设置Iframe高度,如果Iframe中包含一个单一的页面是好用的,但是这个页面包含了两个TAB页   就        只能得到第一个TAB页内容的高度;
2、这样导致的问题是:如果第二个TAB页中内容的高度大于第一个TAB页中内容的高度,第二个TAB页中内容显示不全;
3、想要的解决方法:能不能动态获得Iframe中内容的高度时,哪个TAB中内容的高度最大就获取哪一个?
4、我下载的代码是这样的(请别找这段代码回复我):
       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 name="frameReport" id="frameReport"  allowtransparency="true"   width="100%" height="100%"     scrolling="no" 
         frameborder="0"  border="0" noresize="noresize" framespacing="0" onLoad="Javascript:SetWinHeight(this)">  
</iframe>

解决方案 »

  1. 如图所示,动态设置iframe的大小为Sheet_1内容的大小,而Sheet_2的内容比Sheet_1内容多即高度大,所以Sheet_2中信息显示不全:
      

  2. 个人感觉动态设置Iframe,会导致页面变化很大,用户体验度太差!
      

  3. 找出最大TAB 的高度 赋值给 IFRAME
    var H = 0
    $(TAB).each(function(){
         if (H <$(this).attr("scrollHeight")) H = $(this).attr("scrollHeight");
    })
    $(Iframe,parent.document).height(H)
      

  4. 遍历tab的高度,把最大值取出来赋给iframe
      

  5. 修改你的 iframe 子页面body 高度。修改成最高的 tab 显示后的高度
      

类似问题 »