多个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 相关文章推荐
讲两件事:1.this指针的用法小探. 2.ie的attachEvent和firefox的addEventListener在事件处理上的区别
Apr 12 Javascript
js弹窗代码 可以指定弹出间隔
Jul 03 Javascript
利用json获取字符出现次数的代码
Mar 22 Javascript
JS获取月的最后一天与JS得到一个月份最大天数的实例代码
Dec 16 Javascript
JS获得一个对象的所有属性和方法实例
Feb 21 Javascript
微信小程序之网络请求简单封装实例详解
Jun 28 Javascript
JS实现简单表格排序操作示例
Oct 07 Javascript
使用clipboard.js实现复制功能的示例代码
Oct 16 Javascript
详解Node.js中的Async和Await函数
Feb 22 Javascript
详解简单易懂的 ES6 Iterators 指南和示例
Sep 24 Javascript
基于Vue的侧边目录组件的实现
Feb 05 Javascript
关于uniApp editor微信滑动问题
Jan 15 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 购物车完整实现代码
2014/06/05 PHP
PHP获取windows登录用户名的方法
2014/06/24 PHP
PHP实现添加购物车功能
2017/03/06 PHP
PHP实现的分页类定义与用法示例
2017/07/05 PHP
php 替换文章中的图片路径,下载图片到本地服务器的方法
2018/02/06 PHP
Yii2处理密码加密及验证的方法
2019/05/12 PHP
PHP常见的序列化与反序列化操作实例分析
2019/10/28 PHP
phpstorm最新激活码分享亲测phpstorm2020.2.3版可用
2020/11/22 PHP
jQuery 自动增长的文本输入框实现代码
2010/04/02 Javascript
基于编写jQuery的无缝滚动插件
2014/08/02 Javascript
浅谈Javascript如何实现匀速运动
2014/12/19 Javascript
基于JavaScript实现简单的随机抽奖小程序
2016/01/05 Javascript
JQuery为元素添加样式的实现方法
2016/07/20 Javascript
基于JavaScript实现带缩略图的轮播效果
2017/01/12 Javascript
layui分页效果实现代码
2017/05/19 Javascript
Javascript实现从小到大的数组转换成二叉搜索树
2017/06/13 Javascript
Node.js JSON模块用法实例分析
2019/01/04 Javascript
vue+element tabs选项卡分页效果
2020/06/29 Javascript
vue实现设置载入动画和初始化页面动画效果
2019/10/28 Javascript
vue 组件内获取actions的response方式
2019/11/08 Javascript
原生js实现随机点名
2020/07/05 Javascript
vue 使用rules对表单字段进行校验的步骤
2020/12/25 Vue.js
js实现简单图片拖拽效果
2021/02/22 Javascript
[00:03]DOTA2新版本PA至宝展示
2014/11/19 DOTA
[40:16]TFT vs Mski Supermajor小组赛C组 BO3 第二场 6.3
2018/06/04 DOTA
Python获取DLL和EXE文件版本号的方法
2015/03/10 Python
python使用Matplotlib绘制分段函数
2018/09/25 Python
pycharm debug功能实现跳到循环末尾的方法
2018/11/29 Python
html5写一个BUI折叠菜单插件的实现方法
2019/09/11 HTML / CSS
C#面试问题
2016/07/29 面试题
经济管理专业毕业生推荐信
2013/11/11 职场文书
中专生自我鉴定书范文
2013/12/28 职场文书
艺术教育实施方案
2014/05/03 职场文书
会计电算化专业求职信
2014/06/10 职场文书
公司总经理岗位职责范本
2014/08/15 职场文书
员工旷工检讨书
2015/08/15 职场文书