多个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 相关文章推荐
通过jQuery打造支持汉字,拼音,英文快速定位查询的超级select插件
Jun 18 Javascript
jquery1.10给新增元素绑定事件的方法
Mar 06 Javascript
jquery做的一个简单的屏幕锁定提示框
Mar 26 Javascript
JavaScript中Cookies的相关使用教程
Jun 04 Javascript
jquery实现页面虚拟键盘特效
Aug 08 Javascript
js实现页面跳转的五种方法推荐
Mar 10 Javascript
前端开发必知的15个jQuery小技巧
Jan 22 Javascript
为JQuery EasyUI 表单组件增加焦点切换功能的方法
Apr 13 jQuery
深入理解node.js之path模块
May 03 Javascript
js module大战
Apr 19 Javascript
详解vue 路由跳转四种方式 (带参数)
Apr 28 Javascript
深入浅析Vue中mixin和extend的区别和使用场景
Aug 01 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
php中filter_input函数用法分析
2014/11/15 PHP
PHP中substr_count()函数获取子字符串出现次数的方法
2016/01/07 PHP
Laravel 简单实现Ajax滚动加载示例
2019/10/22 PHP
解读JavaScript中 For, While与递归的用法
2013/05/07 Javascript
JavaScript Array对象扩展indexOf()方法
2014/05/09 Javascript
jQuery拖拽插件gridster使用指南
2015/04/21 Javascript
基于JavaScript实现移动端点击图片查看大图点击大图隐藏
2015/11/04 Javascript
JS验证邮件地址格式方法小结
2015/12/01 Javascript
推荐阅读的js快速判断IE浏览器(兼容IE10与IE11)
2015/12/13 Javascript
js实现瀑布流的三种方式比较
2020/06/28 Javascript
利用fecha进行JS日期处理
2016/11/21 Javascript
在vue.js中抽出公共代码的方法示例
2017/06/08 Javascript
Vue学习笔记进阶篇之vue-router安装及使用方法
2017/07/19 Javascript
vuejs事件中心管理组件间的通信详解
2017/08/09 Javascript
在一个页面实现两个zTree联动的方法
2017/12/20 Javascript
Vue cli3 库模式搭建组件库并发布到 npm的流程
2018/10/12 Javascript
JS中使用cavas截图网页并解决跨域及模糊问题
2018/11/13 Javascript
vue实现自定义H5视频播放器的方法步骤
2019/07/01 Javascript
JS前端知识点总结之内置对象,日期对象和定时器相关操作
2019/07/05 Javascript
vue element-ui table组件动态生成表头和数据并修改单元格格式 父子组件通信
2019/08/15 Javascript
Vue搭建后台系统需要注意的问题
2019/11/08 Javascript
卸载vue2.0并升级vue_cli3.0的实例讲解
2020/02/16 Javascript
如何阻止移动端浏览器点击图片浏览
2020/08/29 Javascript
[00:55]2015国际邀请赛中国区预选赛5月23日——28日约战上海
2015/05/25 DOTA
Python3中简单的文件操作及两个简单小实例分享
2017/06/18 Python
python内置函数:lambda、map、filter简单介绍
2017/11/16 Python
Python3.5装饰器原理及应用实例详解
2019/04/30 Python
Python imageio读取视频并进行编解码详解
2019/12/10 Python
python多维数组分位数的求取方式
2020/03/03 Python
keras.utils.to_categorical和one hot格式解析
2020/07/02 Python
巧克力领导品牌瑞士莲美国官网:Lindt Chocolate美国
2016/08/25 全球购物
One.com挪威:北欧成长最快的网络托管公司
2016/11/19 全球购物
高三语文教学反思
2014/01/15 职场文书
单位租房协议范本
2014/12/03 职场文书
关于上班时间调整的通知
2015/04/23 职场文书
swagger如何返回map字段注释
2021/07/03 Java/Android