父页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父页面和子页面高度自适应相关推荐

  1. iframe父元素获取子页面的元素

    父页面 <iframe src="iframe.html" id="iframeId" height="150" width=&quo ...

  2. iframe父页面与子页面如何传值

    一.父页面向子页面传值 parent.vue <template><iframe id="iframe" width="100%" :src= ...

  3. iframe父页面与子页面之间的元素获取与方法调用

    JS   父页面调用子页面 子页面调用父页面 元素 window.frames[iframe的name属性值]; ① window.parent.document.getElementById(&qu ...

  4. js里父页面与子页面的相互调用

    一.在页面里用 open 打开的子页面: 1.子页面调用父页面的方法,包括子页面给父页面传值:     window.opener.methodName();   window.opener.meth ...

  5. js父页面和子页面之间传值

    今天和朋友一块讨论,怎样通过js在父页面和子页面之间传值的问题,总结例如以下: 需求描写叙述:父页面有多个子页面.实如今父页面点击子页面,传值到子页面. 看着非常easy,试了好久.主要纠结在怎样获取 ...

  6. artdialog4.1.7 中父页面给子页面传值

    artdialog4.1.7中父页面给子页面传值时看了一些网友的解决方法: 在父页面声明全局变量 var returnValue=" ",子页面用art.dialog.opener ...

  7. 父页面调用子页面方法, 子页面加载父页面传送的数据

    先看效果图就明白需求了: 点击search查询结果集, 点击某一条将该条的其他信息分别加载到tab1和tab2中, 即net bill和other amount这两个tab. 点击clear清空查询条 ...

  8. Layui父页面和子页面直接互相传值

    目录 概述 后端 前端 父页面样式 父页面代码 子页面代码 父页面->子页面 子页面->父页面 可能产生的疑问 概述 实现效果: ①将父页面的数据表格的指定行数据,传递到子页面. (点击父 ...

  9. vue 子页面调用父页面的参数_js父页面调用子页面数据时,子页面通过父页面传过来的参数回调父页面具体方法_html/css_WEB-ITnose...

    今天写代码时发现同一页面多个地方需要调用同一个子页面,如果多个方法调用时,同一子页面回调父页面方法则会出问题,所以查了下资料,让这个功能通用化,根据具体方法回调具体父页面方法,顺便总结一下,希望以后可 ...

  10. layer用ajax往jsp页面传值,layer.open中父页面向子页面传值(示例代码)

    1.咱先看图说话 父list.jsp 子operate.jsp 实现的代码 1 在父页面上完成对子页面的数据渲染 function setData(data) { var lay=layer.open ...

最新文章

  1. 自动类型转换和强制类型转换
  2. 自动化运维工具Saltstack(一)
  3. 基于边缘的图像分割——分水岭算法(watershed)算法分析(附opencv源码分析)
  4. 用掘金-Markdown 编辑器写文章
  5. javafx 调用接口_JavaFX技巧3:使用回调接口
  6. python创建虚拟环境时出现拒绝访问_无法创建虚拟环境
  7. xe6+firedac 连接sybase
  8. 米斯特白帽培训讲义 漏洞篇 文件包含
  9. 编码的奥秘之发报机与继电器
  10. 文件服务器phpstudy,使用phpstudy搭建ftp服务器
  11. 王垠《清华梦破碎》沉思与反省
  12. Linux查看文件数量
  13. P5385 [Cnoi2019]须臾幻境 LCT+主席树 维护区间联通块个数
  14. NLP中的全局注意力机制(Global Attention)
  15. 开发制作一个小程序需要多少钱
  16. Floyd 算法+例题
  17. PHP下制作图灵机器人程序
  18. 5G技术能不能支持在高铁列车上的多路虚拟现实业务?
  19. 如何兼容IE4:Web浏览器兼容性浅谈
  20. SRS:流媒体服务器如何实现负载均衡

热门文章

  1. 体验迟到:果然是魔鬼定律,一路上多种障碍
  2. CSDN博文分类全部删除了?
  3. 编译安装ccache
  4. 用网速作为手机信号强度
  5. 自己经常测试,不要等别人发现系统死了
  6. 管理感悟:谈谈用户和需求
  7. 64位程序如何调用32位dll(简单解决方案 )
  8. 2台电脑一根网线传文件_安卓端和Mac快速连接传文件
  9. 电脑机器人_磨小分校参加成都市“青少年电脑机器人创新实践活动”巡航者决赛...
  10. pandas不显示index_Pandas中文官档 ~ 基础用法1