jQuery简单实现iframe的高度根据页面内容自适应的方法


Posted in Javascript onAugust 01, 2016

本文实例讲述了jQuery简单实现iframe的高度根据页面内容自适应的方法。分享给大家供大家参考,具体如下:

方式1:

//注意:下面的代码是放在和iframe同一个页面中调用
$("#iframeId").load(function () {
    var mainheight = $(this).contents().find("body").height() + 30;
    $(this).height(mainheight);
});

方式2:

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

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

Javascript 相关文章推荐
bootstrap改变按钮加载状态
Dec 01 Javascript
js 获取元素在页面上的偏移量的方法汇总
Apr 13 Javascript
javascript实现youku的视频代码自适应宽度
May 25 Javascript
仅9张思维导图帮你轻松学习Javascript 就这么简单
Jun 01 Javascript
JavaScript实现复制文章自动添加版权
Aug 02 Javascript
[原创]JS基于FileSaver.js插件实现文件保存功能示例
Dec 08 Javascript
JS限制条件补全问题实例分析
Dec 16 Javascript
JavaScript队列的应用实例详解【经典数据结构】
Apr 12 Javascript
jQuery实现checkbox即点即改批量删除及中间遇到的坑
Nov 11 jQuery
手写简单的jQuery雪花飘落效果实例
Apr 22 jQuery
基于vue实现可搜索下拉框定制组件
Mar 26 Javascript
Javascript如何实现扩充基本类型
Aug 26 Javascript
JQuery之proxy实现绑定代理方法
Aug 01 #Javascript
AngularJS入门教程之ng-checked 指令详解
Aug 01 #Javascript
浅谈JavaScript中面向对象的的深拷贝和浅拷贝
Aug 01 #Javascript
Javascript OOP之面向对象
Jul 31 #Javascript
JavaScript的字符串方法汇总
Jul 31 #Javascript
javascript 数组的正态分布排序的问题
Jul 31 #Javascript
详细谈谈javascript的对象
Jul 31 #Javascript
You might like
PHP 组件化编程技巧
2009/06/06 PHP
使用swoole扩展php websocket示例
2014/02/13 PHP
php中current、next与reset函数用法实例
2014/11/17 PHP
php打包网站并在线压缩为zip
2016/02/13 PHP
PHP调用接口用post方法传送json数据的实例
2018/05/31 PHP
JavaScript Memoization 让函数也有记忆功能
2011/10/27 Javascript
js根据日期判断星座的示例代码
2014/01/23 Javascript
jQuery中element选择器用法实例
2014/12/29 Javascript
JavaScript实现动画打开半透明提示层的方法
2015/04/21 Javascript
详解JavaScript对Date对象的操作问题(生成一个倒数7天的数组)
2015/10/01 Javascript
基于javascript实现彩票随机数生成(升级版)
2020/04/17 Javascript
深入剖析JavaScript面向对象编程
2016/07/12 Javascript
jQuery.form.js的使用详解
2017/06/14 jQuery
jQuery实现的淡入淡出图片轮播效果示例
2018/08/29 jQuery
JS实现的新闻列表自动滚动效果示例
2019/01/30 Javascript
详解无限滚动插件vue-infinite-scroll源码解析
2019/05/12 Javascript
vue-cli webpack配置文件分析
2019/05/20 Javascript
vue中使用 pako.js 解密 gzip加密字符串的方法
2019/06/10 Javascript
laypage+SpringMVC实现后端分页
2019/07/27 Javascript
nuxt 自定义 auth 中间件实现令牌的持久化操作
2020/11/05 Javascript
[03:59]DOTA2英雄梦之声_第07期_水晶室女
2014/06/23 DOTA
python将控制台输出保存至文件的方法
2019/01/07 Python
flask的orm框架SQLAlchemy查询实现解析
2019/12/12 Python
pycharm工具连接mysql数据库失败问题
2020/04/01 Python
Python自动化办公Excel模块openpyxl原理及用法解析
2020/11/05 Python
Lands’ End英国官方网站:高质量男女服装
2017/10/07 全球购物
马来西亚最大的在线隐形眼镜商店:MrLens
2019/03/27 全球购物
当当网软件测试笔试题
2015/11/24 面试题
挂牌仪式主持词
2014/03/20 职场文书
保护野生动物倡议书
2014/05/16 职场文书
校庆标语集锦
2014/06/25 职场文书
计算机实训报告范文
2014/11/05 职场文书
2014超市收银员工作总结
2014/11/13 职场文书
通知格式
2015/04/27 职场文书
辅导员学期工作总结
2015/08/14 职场文书
根德5570型九灯四波段立体声收音机是电子管收音机的楷模 ? 再论5570
2022/04/05 无线电