多个iframe自动调整大小的问题


Posted in Javascript onSeptember 18, 2006

一个页面我有多个iframe,且每个iframe的src都不一样,高度也不一样。
怎样用一个函数,自动调整这个页面里所有iframe的高度呢?

function change_size(iframe)
{
    iframe.style.height=info_content.document.body.scrollHeight+1+"px";
}
我用过这种方式,但是等号后面的第一个对象不知道应该怎样动态显示。
比如:
function change_size(no)
{
                var el_name = "iframe"+no;
                el = document.getElementById(el_name);
    el .style.height=el.document.body.scrollHeight+1+"px";
                //举例,实际不能调整高度,因为后面的el不能指向正确的对象
}

所以我现在暂时用了这种方式,对应每个iframe用一次 
a.style.height = iframe_a.document.body.scrollHeight
b.style.height = iframe_b.document.body.scrollHeight

希望您能给一个更为简单的方法,我解除js没多久,可能问题有点愚蠢,请见谅。
感觉上你这样写的自动调整 会出问题.
如果父页面加载完了,而子页面没有加载完,你控制的iframe高度肯定不会是 你所想的高度.

如果你的子页面和父页面同在一个域名下给你推荐一种简单办法.

在父页面中设置一个函数用来 调整某一个ifame的高度,然后在子页面的body onload中调用父页面的这个函数.这样肯定是 等子页面加载完了 在设置的高度,这样可设置成子页面的实际高度.

//父页面的设置高度代码,未测试

function setParentFrameHeight(frameid,height){ 
    var frame= document.getElementById(frameid); 
    frame.style.height = height;//实际的height可以可以在子页面的body里获得 
}
Javascript 相关文章推荐
JavaScript 事件的一些重要说明
Oct 25 Javascript
ASP.NET jQuery 实例14 在ASP.NET form中校验时间范围
Feb 03 Javascript
iframe 上下滚动条如何默认在下方实现原理
Dec 10 Javascript
jQuery对象和Javascript对象之间转换的实例代码
Mar 20 Javascript
jQuery实现点击查看大图并以弹框的形式居中
Aug 08 Javascript
使用PBFunc在Powerbuilder中支付宝当面付款功能
Oct 01 Javascript
vue实现添加标签demo示例代码
Jan 21 Javascript
Vue移动端右滑屏幕返回上一页附源码下载
Jun 26 Javascript
解决vue组件销毁之后计时器继续执行的问题
Jul 21 Javascript
微信小程序自定义tabBar的踩坑实践记录
Nov 06 Javascript
Vue路由权限控制解析
Nov 09 Javascript
JavaScript实现栈结构详细过程
Dec 06 Javascript
跨浏览器的设置innerHTML方法
Sep 18 #Javascript
JavaScript Base64编码和解码,实现URL参数传递。
Sep 18 #Javascript
JavaScript静态的动态
Sep 18 #Javascript
基于Web标准的UI组件 — 树状菜单(2)
Sep 18 #Javascript
JavaScript中的私有成员
Sep 18 #Javascript
javascript的事件描述
Sep 08 #Javascript
由浅到深了解JavaScript类
Sep 08 #Javascript
You might like
《斗罗大陆》六翼天使武魂最强,为什么老千家不是上三宗?
2020/03/02 国漫
第十四节 命名空间 [14]
2006/10/09 PHP
PHP错误和异长常处理总结
2014/03/06 PHP
PHP常用字符串函数用法实例总结
2020/06/04 PHP
js下弹出窗口的变通
2007/04/18 Javascript
checkbox 多选框 联动实现代码
2008/10/22 Javascript
jquery实现仿新浪微博评论滚动效果
2015/08/06 Javascript
jQuery仿淘宝网产品品牌隐藏与显示效果
2015/09/01 Javascript
JS实现弹性漂浮效果的广告代码
2015/09/02 Javascript
jQuery选择器及jquery案例详解(必看)
2016/05/20 Javascript
Jquery遍历select option和添加移除option的实现方法
2016/08/26 Javascript
JavaScript使用ZeroClipboard操作剪切板
2017/05/10 Javascript
ionic2懒加载配置详解
2017/09/01 Javascript
使用Vue自定义数字键盘组件(体验度极好)
2017/12/19 Javascript
深入Node TCP模块的理解
2019/03/13 Javascript
vue组件暴露和.js文件暴露接口操作
2020/08/11 Javascript
[02:04]2016国际邀请赛中国区预选赛VG.R晋级之路
2016/07/01 DOTA
[51:53]完美世界DOTA2联赛决赛日 Inki vs LBZS 第二场 11.08
2020/11/10 DOTA
Python Json序列化与反序列化的示例
2018/01/31 Python
python实现SOM算法
2018/02/23 Python
python中利用numpy.array()实现俩个数值列表的对应相加方法
2019/08/26 Python
numpy中三维数组中加入元素后的位置详解
2019/11/28 Python
关于Keras Dense层整理
2020/05/21 Python
如何把python项目部署到linux服务器
2020/08/26 Python
数据库专业英语
2012/11/30 面试题
中学生英语演讲稿
2014/04/26 职场文书
住院医师规范化培训实施方案
2014/06/12 职场文书
文员求职信
2014/07/15 职场文书
党员民主生活会对照检查材料思想汇报
2014/09/28 职场文书
2014年公路养护工作总结
2014/12/04 职场文书
档案接收函格式
2015/01/30 职场文书
2015大学迎新晚会主持词
2015/07/16 职场文书
导游词之金鞭溪风景区
2019/09/12 职场文书
python 实现德洛内三角剖分的操作
2021/04/22 Python
对讲机知识
2022/04/07 无线电
MySQL如何修改字段类型和字段长度
2022/06/10 MySQL