iframe使用过程中的一些注意事项

现在一直从事web前端的开发,对应iframe使用蛮多,现在总结一下希望对别人有所帮助。
1.iframe自动适应
iframe标签就相当于内嵌一个画面,子画面的初始化加载总是要晚于父级画面的,所以必须添加一个自动适应高度方法,让父级画面和子级画面的高度保持一致,不然会出现无法加载的情况。
个人采用的方法如下:
function autoResizeFrame(){
//frameId为iframe的id
var parentFrameId = parent.document.getElementById("frameId");
if(parentFrameId){
//判断是否是IE浏览器
if(Ext.isIE){
//将子画面的高度设置给iframe,这里采用ext获取子画面的高度,具体情况自己参考
parentFrameId.style.height = Ext.get("iframeDiv").getHeight();
}else{
//fireFox浏览器
parentFrameId.style.height = document.getElementById("iframeDiv").clientHeight;
}
}
}
2.IE6下iframe不显示的问题
这是我为了解决一个问题查到一位大牛提供的说明,虽然最终问题的解决和这个没有关系,但还是贴出来跟大家分享一下。很多时候我都喜欢采用第2种方式。

(1). 可能你的iframe没有设置宽高,例如在table不居中,计算不出来td的高度,会导致这种问题
(2). 尝试使用下面的代码来重新载入IE6下的iframe页面:

setTimeout(function(){
document.frames['fuckIE6'].location.reload();
},0)
(3). 传闻iframe标签中不要把src紧跟在iframe之后,也就是<iframe src='js8.in' name='fuckIE6'></iframe>是错误的,不过我没有碰见过类似的问题,为了保险起见,还是不要写成上面的样式为妙。
3.还有就是滚动条的问题
很多时候采用iframe都会出现双滚动条,这种最好的方式是采用
<iframe id="listFrame" scrolling="no" />
然后在子级画面添加滚动条,不过具体还是还是要具体自己调节了。
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值