JS实现iframe自适应高度的方法示例


Posted in Javascript onJanuary 07, 2017

本文实例讲述了JS实现iframe自适应高度的方法。分享给大家供大家参考,具体如下:

<iframe id="mainFrame" name="mainFrame" src="/zwgk/hsearchview" width="740" frameborder="0" scrolling="no" scrolling="no" frameborder="0" >
</iframe>
<script type="text/javascript" language="javascript">
function reinitIframe(){
 var iframe = document.getElementById("mainFrame");
 try{
 var bHeight = iframe.contentWindow.document.body.scrollHeight;
 var dHeight = iframe.contentWindow.document.documentElement.scrollHeight;
 var height = Math.max(bHeight, dHeight);
 iframe.height = height;
 }catch (ex){}
 }
 window.setInterval("reinitIframe()", 100);
</script>

PS:高度自适应应用广泛,本站的很多在线工具也使用了这一技巧,列举如下几个工具供大家参考:

JavaScript在线格式化工具(基于beautify.js插件):
http://tools.3water.com/code/js_beautify

在线颜色选择器工具/RGB颜色查询对照表:
http://tools.3water.com/color/colorpicker

在线个人所得税计算器:
http://tools.3water.com/jisuanqi/tax_calc

宋词在线查询:
http://tools.3water.com/bianmin/songci

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
JQuery 遮罩层实现(mask)实现代码
Jan 09 Javascript
jQuery源码分析之jQuery.fn.each与jQuery.each用法
Jan 23 Javascript
AngularJS学习笔记之基本指令(init、repeat)
Jun 16 Javascript
javascript实现图片延迟加载方法汇总(三种方法)
Aug 27 Javascript
微信支付 JS API支付接口详解
Jul 11 Javascript
基于BootStrap环境写jQuery tabs插件
Jul 12 Javascript
微信js-sdk界面操作接口用法示例
Oct 12 Javascript
javascript高级模块化require.js的具体使用方法
Oct 31 Javascript
node实现登录图片验证码的示例代码
Apr 20 Javascript
关于layui表单中按钮自动提交的解决方法
Sep 09 Javascript
详细介绍解决vue和jsp结合的方法
Feb 06 Javascript
Electron实现应用打包、自动升级过程解析
Jul 07 Javascript
JS小数转换为整数的方法分析
Jan 07 #Javascript
jQuery日程管理插件fullcalendar使用详解
Jan 07 #Javascript
基于jquery二维码生成插件qrcode
Jan 07 #Javascript
jquery validation验证表单插件
Jan 07 #Javascript
JQuery ZTree使用方法详解
Jan 07 #Javascript
jquery实现转盘抽奖功能
Jan 06 #Javascript
BootStrap3中模态对话框的使用
Jan 06 #Javascript
You might like
聊天室php&amp;mysql(四)
2006/10/09 PHP
PHP 和 XML: 使用expat函数(一)
2006/10/09 PHP
php连接函数implode与分割explode的深入解析
2013/06/26 PHP
Php header()函数语法及使用代码
2013/11/04 PHP
ThinkPHP多语言支持与多模板支持概述
2014/08/22 PHP
PHP使用gearman进行异步的邮件或短信发送操作详解
2020/02/27 PHP
javascript 密码强弱度检测万能插件
2009/02/25 Javascript
JS限制上传图片大小不使用控件在本地实现
2012/12/19 Javascript
javascript创建数组之联合数组的使用方法示例
2013/12/26 Javascript
按下回车键指向下一个位置的一个函数代码
2014/03/10 Javascript
IE6-8中Date不支持toISOString的修复方法
2014/05/04 Javascript
js onmousewheel事件多次触发问题解决方法
2014/10/17 Javascript
JavaScript给url网址进行encode编码的方法
2015/03/18 Javascript
js操作cookie保存浏览记录的方法
2015/12/25 Javascript
jQuery animate easing使用方法图文详解
2016/06/17 Javascript
Highcharts学习之坐标轴
2016/08/02 Javascript
微信小程序canvas分享海报功能
2019/10/31 Javascript
jQuery轮播图功能制作方法详解
2019/12/03 jQuery
[00:35]DOTA2上海特级锦标赛 MVP.Phx战队宣传片
2016/03/04 DOTA
python数据库操作常用功能使用详解(创建表/插入数据/获取数据)
2013/12/06 Python
python自动安装pip
2014/04/24 Python
Python的内存泄漏及gc模块的使用分析
2014/07/16 Python
举例讲解Python中的死锁、可重入锁和互斥锁
2015/11/05 Python
深入解析Python编程中super关键字的用法
2016/06/24 Python
Django实战之用户认证(用户登录与注销)
2018/07/16 Python
python+flask实现API的方法
2018/11/21 Python
解决Django加载静态资源失败的问题
2019/07/28 Python
通过字符串导入 Python 模块的方法详解
2019/10/27 Python
基于Python模拟浏览器发送http请求
2020/11/06 Python
Python 利用Entrez库筛选下载PubMed文献摘要的示例
2020/11/24 Python
纯CSS实现的大小渐变、渐远效果
2014/04/15 HTML / CSS
英国最大的宠物食品和宠物用品网上零售商: Zooplus
2016/08/01 全球购物
Sofft鞋官网:世界知名鞋类品牌
2017/03/28 全球购物
一份创业计划书范文
2014/02/08 职场文书
模范班主任事迹材料
2014/12/17 职场文书
nginx简单配置多个server的方法
2021/03/31 Servers