iframe父页面和子页面高度自适应
父页HTML:
<iframe id="mainframe" name="mainframe" style="width:100%;" marginheight="0" marginwidth="0" onLoad="iFrameHeight()" scrolling="auto" frameborder="0" src="Index.aspx"></iframe>
父页JS:
<script src="../Scripts/js/jquery-2.1.1.min.js"></script>
<script>
function iFrameHeight() {
var ifm = document.getElementById("mainframe");
var subWeb = document.frames ? document.frames["mainframe"].document : ifm.contentDocument;
if (ifm != null && subWeb != null) {
ifm.height = document.body.offsetHeight;
ifm.width = subWeb.body.scrollWidth;
}
}
</script>
子页JS
<script src="../Scripts/js/jquery-2.1.1.min.js"></script>
<script>
$(window.parent.document).find("#mainframe").load(function () {
var ifm = window.parent.document.getElementById("mainframe");
var subWeb = window.parent.document.frames ? window.parent.document.frames["mainframe"].document : ifm.contentDocument;
if (ifm != null && subWeb != null) {
ifm.height = subWeb.body.offsetHeight + 20; //预留出灵活高度20px
ifm.width = subWeb.body.scrollWidth;
}
});
</script>
转载于:https://www.cnblogs.com/weimingxin/p/8193795.html
iframe父页面和子页面高度自适应相关推荐
- iframe父元素获取子页面的元素
父页面 <iframe src="iframe.html" id="iframeId" height="150" width=&quo ...
- iframe父页面与子页面如何传值
一.父页面向子页面传值 parent.vue <template><iframe id="iframe" width="100%" :src= ...
- iframe父页面与子页面之间的元素获取与方法调用
JS 父页面调用子页面 子页面调用父页面 元素 window.frames[iframe的name属性值]; ① window.parent.document.getElementById(&qu ...
- js里父页面与子页面的相互调用
一.在页面里用 open 打开的子页面: 1.子页面调用父页面的方法,包括子页面给父页面传值: window.opener.methodName(); window.opener.meth ...
- js父页面和子页面之间传值
今天和朋友一块讨论,怎样通过js在父页面和子页面之间传值的问题,总结例如以下: 需求描写叙述:父页面有多个子页面.实如今父页面点击子页面,传值到子页面. 看着非常easy,试了好久.主要纠结在怎样获取 ...
- artdialog4.1.7 中父页面给子页面传值
artdialog4.1.7中父页面给子页面传值时看了一些网友的解决方法: 在父页面声明全局变量 var returnValue=" ",子页面用art.dialog.opener ...
- 父页面调用子页面方法, 子页面加载父页面传送的数据
先看效果图就明白需求了: 点击search查询结果集, 点击某一条将该条的其他信息分别加载到tab1和tab2中, 即net bill和other amount这两个tab. 点击clear清空查询条 ...
- Layui父页面和子页面直接互相传值
目录 概述 后端 前端 父页面样式 父页面代码 子页面代码 父页面->子页面 子页面->父页面 可能产生的疑问 概述 实现效果: ①将父页面的数据表格的指定行数据,传递到子页面. (点击父 ...
- vue 子页面调用父页面的参数_js父页面调用子页面数据时,子页面通过父页面传过来的参数回调父页面具体方法_html/css_WEB-ITnose...
今天写代码时发现同一页面多个地方需要调用同一个子页面,如果多个方法调用时,同一子页面回调父页面方法则会出问题,所以查了下资料,让这个功能通用化,根据具体方法回调具体父页面方法,顺便总结一下,希望以后可 ...
- layer用ajax往jsp页面传值,layer.open中父页面向子页面传值(示例代码)
1.咱先看图说话 父list.jsp 子operate.jsp 实现的代码 1 在父页面上完成对子页面的数据渲染 function setData(data) { var lay=layer.open ...
最新文章
- 自动类型转换和强制类型转换
- 自动化运维工具Saltstack(一)
- 基于边缘的图像分割——分水岭算法(watershed)算法分析(附opencv源码分析)
- 用掘金-Markdown 编辑器写文章
- javafx 调用接口_JavaFX技巧3:使用回调接口
- python创建虚拟环境时出现拒绝访问_无法创建虚拟环境
- xe6+firedac 连接sybase
- 米斯特白帽培训讲义 漏洞篇 文件包含
- 编码的奥秘之发报机与继电器
- 文件服务器phpstudy,使用phpstudy搭建ftp服务器
- 王垠《清华梦破碎》沉思与反省
- Linux查看文件数量
- P5385 [Cnoi2019]须臾幻境 LCT+主席树 维护区间联通块个数
- NLP中的全局注意力机制(Global Attention)
- 开发制作一个小程序需要多少钱
- Floyd 算法+例题
- PHP下制作图灵机器人程序
- 5G技术能不能支持在高铁列车上的多路虚拟现实业务?
- 如何兼容IE4:Web浏览器兼容性浅谈
- SRS:流媒体服务器如何实现负载均衡