JS动态改变iframe的高度

在数飞OA的开发过程中,遇到问题:一个jsp页面嵌套一个html页面。

〈iframe id="docDetail" width="100%"  height="200"
        frameborder="0" 
        src="a.htm"〉
〈/iframe〉

而a.html不是固定大小的,这个时候嵌套的iframe就会出现滚动条。

通过js获取iframe的高度,然后动态的改变,这样就不会出现滚动条。

方式一:在jsp的body里增加onload方法 

  〈body οnlοad="javascript:ResizeFrame();"〉
  
  function ResizeFrame() {
   var oFrame = document.getElementById("docDetail");
   var vHeight= document.frames("docDetail").document.body.scrollHeight;   
 oFrame.height = vHeight;  
  }

  通过document.frames("docDetail")可以获得确实的高度
  通过document.getElementById("docDetail")可以改变frame的高度。

方式二:在html的body里增加onload方法:
  〈body onLoad="javascript:ReSize();"〉

  function ReSize() {
    //自动调节窗口的大小
    var vHeight = document.body.scrollHeight + 30;
    window.resizeTo(650, vHeight);
  }


******************************************************

获取父页面iframe的高度时需要注意的:

var _head = window.parent.parent.document.getElementById("mainIframe").height;

var _head = window.parent.parent.document.frames("mainIframe").height;

使用上面方式可以获取到准确的高度;

******************************************************

var _head = window.parent.parent.frames("mainIframe").height;

使用上面的方式无法获取到高度;

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值