多个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 prop的使用介绍及与attr的区别
Dec 19 Javascript
jquery无限级联下拉菜单简单实例演示
Nov 23 Javascript
浅析javascript的return语句
Dec 15 Javascript
自制微信公众号一键排版工具
Sep 22 Javascript
jQuery.Ajax()的data参数类型详解
Jul 23 jQuery
angular1.x ui-route传参的三种写法小结
Aug 31 Javascript
Vue项目从webpack3.x升级webpack4不完全指南
Apr 28 Javascript
jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能示例
May 27 jQuery
什么时候不能在 Node.js 中使用 Lock Files
Jun 24 Javascript
vue的路由映射问题及解决方案
Oct 14 Javascript
jQuery实现轮播图效果
Nov 26 jQuery
vue使用nprogress加载路由进度条的方法
Jun 04 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函数
2011/05/31 PHP
php输出1000以内质数(素数)示例
2014/02/16 PHP
php基于SQLite实现的分页功能示例
2017/06/21 PHP
filemanage功能中用到的common.js
2007/04/08 Javascript
javascript 极速 隐藏/显示万行表格列只需 60毫秒
2009/03/28 Javascript
JS实现往下不断流动网页背景的方法
2015/02/27 Javascript
禁止按回车键提交表单的方法
2015/06/11 Javascript
JavaScript实现动态删除列表框值的方法
2015/08/12 Javascript
浅谈jQuery效果函数
2016/09/16 Javascript
浅析JavaScript动画模拟拖拽原理
2016/12/09 Javascript
vue监听scroll的坑的解决方法
2017/09/07 Javascript
Parcel.js + Vue 2.x 极速零配置打包体验教程
2017/12/24 Javascript
vue工程全局设置ajax的等待动效的方法
2019/02/22 Javascript
Element 默认勾选表格 toggleRowSelection的实现
2019/09/04 Javascript
详解template标签用法(含vue中的用法总结)
2021/01/12 Vue.js
html5以及jQuery实现本地图片上传前的预览代码实例讲解
2021/03/01 jQuery
[02:47]DOTA2亚洲邀请赛 HR战队出场宣传片
2015/02/07 DOTA
[09:40]DAC2018 4.5 SOLO赛 MidOne vs Miracle
2018/04/06 DOTA
Django框架中数据的连锁查询和限制返回数据的方法
2015/07/17 Python
pyqt5 QProgressBar清空进度条的实例
2019/06/21 Python
从numpy数组中取出满足条件的元素示例
2019/11/26 Python
Python yield生成器和return对比代码实例
2020/04/20 Python
Node.js 和 Python之间该选择哪个?
2020/08/05 Python
手把手教你从PyCharm安装到激活(最新激活码),亲测有效可激活至2089年
2020/11/25 Python
利用css3径向渐变做一张优惠券的示例
2018/03/22 HTML / CSS
List, Set, Map是否继承自Collection接口?
2016/05/16 面试题
大型活动组织方案
2014/05/10 职场文书
禁毒宣传工作方案
2014/05/23 职场文书
代领毕业证委托书
2014/08/02 职场文书
劳模先进事迹材料
2014/12/24 职场文书
新教师个人工作总结
2015/02/06 职场文书
幼儿园辞职信范文
2015/02/27 职场文书
2015庆祝七一建党节94周年活动总结
2015/03/20 职场文书
同事离别感言
2015/08/04 职场文书
零基础学java之循环语句的使用
2022/04/10 Java/Android
MySQL中LAG()函数和LEAD()函数的使用
2022/08/14 MySQL