4行代码搞定iframe高度自动变化,完美兼容(转)

本帖转自: http://www.iteye.com/topic/839143
跨域问题 :http://ued.alimama.com/front-end/use-location-hash-to-auto-sizing/

引用
一个iframe高度自动变化的问题搞了我半天,网上找了下资料,不是很好,结合了一下jquery(版本1.3.2),4行代码即可,完美兼容IE、Firefox、Opera、Safari、Google Chrome,js如下:

Js代码 收藏代码

       
function heightSet(thisFrame){
if($.browser.mozilla || $.browser.msie){
// bodyHeight =window.frames["thisFrameName"].document.body.scrollHeight;
bodyHeight = document.body.clientHeight
}else{
bodyHeight =thisFrame.contentWindow.document.documentElement.scrollHeight;
//这行可代替上一行,这样heightSet函数的参数可以省略了
//bodyHeight = document.getElementById("thisFrameId").contentWindow.document.documentElement.scrollHeight;
}
document.getElementById("thisFrameId").height=bodyHeight;
}


引用
第一次发帖,还请指教


[quote现在j2ee做web系统,大部分都离不开iframe,除非你全用ajax,但是ajax到处使用但如果用得不好的话,肯定会一大堆问题。唉!技术有限,只能跟着造造轮子

Js代码 收藏代码

<iframe id="mainFrame" name="mainFrame" frameborder="0" scrolling="no" src="" onload="heightSet(this)">
</iframe>


引用
this关键字在各种浏览器似乎有不同的意思,FF和IE必须要通过iframe的名字去得到内部页面高度,而其他浏览器则可以用this或ID

引用
都在说一个异步的问题,如果你ajax用得特别多,但又不想每次都去设置,那动态改变iframe肯定达不到你的代码清洁要求,没办法,要么你就脱离iframe。我只能说说一般处理方式,毕竟ajax或动态表单在一般应用中只占小数比例,异步请求后只需在后面加上:

Js代码 收藏代码

    parent.window.heightSet();  
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值