教你用jquery实现iframe自适应高度


Posted in Javascript onJune 11, 2014

iframe代码,注意要写ID

<iframe src="test.html" id="main" width="700" height="300" frameborder="0" scrolling="auto"></iframe>

jquery代码一:

//注意:下面的代码是放在test.html调用 
$(window.parent.document).find("#main").load(function(){ 
var main = $(window.parent.document).find("#main"); 
var thisheight = $(document).height()+30; 
main.height(thisheight); 
});

jquery代码二:

//注意:下面的代码是放在和iframe同一个页面调用 
$("#main").load(function(){ 
var mainheight = $(this).contents().find("body").height()+30; 
$(this).height(mainheight); 
});
Javascript 相关文章推荐
浅谈Javascript 执行顺序
Dec 18 Javascript
javascript实现随机读取数组的方法
Aug 03 Javascript
jquery+css3实现网页背景花瓣随机飘落特效
Aug 17 Javascript
js实现完美兼容各大浏览器的人民币大小写相互转换
Oct 29 Javascript
Bootstrap 粘页脚效果
Mar 28 Javascript
JavaScript标准对象_动力节点Java学院整理
Jun 27 Javascript
vue实现全选和反选功能
Aug 31 Javascript
javascript 缓冲运动框架的实现
Sep 29 Javascript
Vue兼容ie9的问题全面解决方案
Jun 19 Javascript
4个顶级开源JavaScript图表库
Sep 29 Javascript
vue使用@scroll监听滚动事件时,@scroll无效问题的解决方法详解
Oct 15 Javascript
JS内置对象和Math对象知识点详解
Apr 03 Javascript
浅析jQuery中调用ajax方法时在不同浏览器中遇到的问题
Jun 11 #Javascript
控制文字内容的显示与隐藏示例
Jun 11 #Javascript
用js一次改变多个input的readonly属性值的方法
Jun 11 #Javascript
jQuery队列操作方法实例
Jun 11 #Javascript
JS生成不重复随机数组的函数代码
Jun 10 #Javascript
JS 在指定数组中随机取出N个不重复的数据
Jun 10 #Javascript
JS生成随机字符串的多种方法
Jun 10 #Javascript
You might like
mysql 查询指定日期时间内sql语句实现原理与代码
2012/12/16 PHP
PHP开发Apache服务器配置
2015/07/15 PHP
PHP 8新特性简介
2020/08/18 PHP
限制textbox或textarea输入字符长度的JS代码
2013/10/16 Javascript
Array 重排序方法和操作方法的简单实例
2014/01/24 Javascript
jquery修改网页背景颜色通过css方法实现
2014/06/06 Javascript
JS实现窗口加载时模拟鼠标移动的方法
2015/06/03 Javascript
Bootstrap编写一个在当前网页弹出可关闭的对话框 非弹窗
2016/06/30 Javascript
基于jQuery实现多标签页切换的效果(web前端开发)
2016/07/24 Javascript
js微信分享API
2020/10/11 Javascript
归纳下js面向对象的几种常见写法总结
2016/08/24 Javascript
浅谈jquery采用attr修改form表单enctype不起作用的问题
2016/11/25 Javascript
jQuery插件autocomplete使用详解
2017/02/04 Javascript
ZeroClipboard.js使用一个flash复制多个文本框
2017/06/19 Javascript
Angular指令之restict匹配模式的详解
2017/07/27 Javascript
Vue的实例、生命周期与Vue脚手架(vue-cli)实例详解
2017/12/27 Javascript
vue-cli项目中使用Mockjs详解
2018/05/14 Javascript
js实现简单分页导航栏效果
2019/06/28 Javascript
小程序实现分类页
2019/07/12 Javascript
layui table设置某一行的字体颜色方法
2019/09/05 Javascript
jquery 时间戳转日期过程详解
2019/10/12 jQuery
微信公众号开发之微信支付代码记录的实现
2019/10/16 Javascript
vue element el-transfer增加拖拽功能
2021/01/15 Vue.js
JavaScript canvas实现跟随鼠标移动小球
2021/02/09 Javascript
python3+PyQt5图形项的自定义和交互 python3实现page Designer应用程序
2020/07/20 Python
python3.7.0的安装步骤
2018/08/27 Python
对python中xlsx,csv以及json文件的相互转化方法详解
2018/12/25 Python
python打造爬虫代理池过程解析
2019/08/15 Python
python 实现兔子生兔子示例
2019/11/21 Python
利用pytorch实现对CIFAR-10数据集的分类
2020/01/14 Python
python使用建议技巧分享(三)
2020/08/18 Python
[原创]赚疯了!转手立赚800+?大佬的python「抢茅台脚本」使用教程
2021/01/12 Python
马来西亚最大的在线隐形眼镜商店:MrLens
2019/03/27 全球购物
警示教育活动总结
2014/05/05 职场文书
党支部意见范文
2015/06/02 职场文书
基于PyQT5制作一个桌面摸鱼工具
2022/02/15 Python