http://www.a.com/A.html

http://www.a.com/B.html

http://www.a.com/D.js

http://www.c.com/C.html

A.html:

<iframe id="iframe_shg" src="http://www.c.com/c.html" frameborder="0" width="100%"></iframe>

________________________________________________________________

B.html:

<!DOCTYPE html>
<html>
<head>
    <meta charset='utf-8' />
    <title>B.html</title>
</head>
<body>
    <script type="text/javascript">
        window.onload = function() {
            var isSet = false
            var inteval = setInterval(function() {
                var search = location.search.replace('?', '')
                if (isSet) {
                    clearInterval(inteval)
                    return
                }
                if (search) {
                    var height = search.split('=')[1]
                    var doc = parent.parent.document
                    var ifr = doc.getElementById('iframe_shg')
                    ifr.style.height = height + 'px'
                    isSet = true
                }
            }, 500)
        }
    </script>
</body>
</html>

________________________________________________________________

D.js

// 计算页面的实际高度，iframe自适应会用到
function calcPageHeight(doc) {
    var cHeight = Math.max(doc.body.clientHeight, doc.documentElement.clientHeight)
    var sHeight = Math.max(doc.body.scrollHeight, doc.documentElement.scrollHeight)
    var height = Math.max(cHeight, sHeight)
    return height
}
window.onload = function () {
    var doc = document
    var height = calcPageHeight(doc)
    var myifr = doc.getElementById('myifr')
    if (myifr) {
        myifr.src = 'http://www.a.com/B.html?height=' + height
        // console.log(doc.documentElement.scrollHeight)    
    }
};

_________________________________________________________________

C.html

<body>

........................

<iframe id="myifr" style="display:none" src="http://www.a.com/B.html"></iframe>
    <script type="text/javascript" src="http://www.a.com/D.js"></script>

</body>

Iframe跨域嵌入页面自动调整高度的办法的更多相关文章

  1. Iframe跨域JavaScript自动适应高度

    重点分析: 主域名页面:页面A,页面C 其它域名页面:页面B 步骤: 1.页面A(主域名)通过Iframe(id="iframeB")嵌套页面B(其它域名) 2.页面B(其它域名) ...

  2. 解决Iframe跨域高度自适应,利用window.postMessage()实现跨域消息传递页面高度（JavaScript）

    在iframe跨域引用高度自适应这块写的js方式都试了不管用,最终使用的是window.postMessage() 跨域获取高度 传递信息 1.首先,在主页面上使用iframe引入子页面:也就是A.h ...

  3. IFrame跨域访问自定义高度

    由于JS禁止跨域访问,如何实现不同域的子页面将高度返回给父页面本身,是解决自定义高度的难点. JS跨域访问问题描述:应用A访问应用B的资源,由于A,B应用分别部署在不同应用服务器(tomcat)上,属 ...

  4. IFrame跨域访问&&IFrame跨域访问自定义高度

    1.IFrame跨域访问: http://blog.csdn.net/fdipzone/article/details/17619673 2.IFrame跨域访问自定义高度: 由于JS禁止跨域访问,如 ...

  5. IE下IFrame引用跨域站点页面时，Session失效问题解决

    问题场景:在一个应用(集团门户)的某个page中, 通过IFrame的方式嵌入另一个应用(集团实时监管系统)的某个页面. 当两个应用的domain 不一样时, 在被嵌入的页面中Session失效.(s ...

  6. 子页面iframe跨域执行父页面定义的JS方法

    问题需求:父页面与子页面iframe跨域嵌套,子页面要触发父页面所定义的js方法.父子页面的数据传递. 下文中会用到一些文件:父页面: parent.html嵌在父页面的子iframe页面:child ...

  7. iframe跨域cookie问题

    今天在项目里面遇到了iframe跨域不能写cookie的问题.应用场景是这样的:有A和B两个业务,A要通过iframe的方式嵌入B,但是在ie下A不能通过写cookie的方式记录信息,在firefox ...

  8. js iframe跨域访问

    1.什么是跨域? 2.前台解决跨域几种方法 2.1 动态创建script 2.2 使用document.domain 2.3使用HTML5新属性postMessage 2.4 利用iframe和loc ...

  9. iframe跨域通信实战

    "长时间不写文章,开头的方式总是那么出奇的相似",最近很忙,好久没写博客了啊(是不是?). 更换工作已经有三个月有余,这段三个月把过去三年没加过的班都加了一次.收获挺多,发现的问题 ...

随机推荐

  1. cf#513 B. Maximum Sum of Digits

    B. Maximum Sum of Digits time limit per test 2 seconds memory limit per test 512 megabytes input sta ...

  2. IDEA 中.properties文件中文自动转Unicode编码及乱码问题

    问题描述: 在使用IDEA开发工具编辑属性文件(.properties)的时候出现中文自动转成了Unicode编码,或在读取属性文件的时候中文出现乱码. 问题解决: 进入 File -> Set ...

  3. 为Zabbix配置RabbitMQ监控模板

    RabbitMQ的配置参考 https://github.com/jasonmcintosh/rabbitmq-zabbix 简而言之,具体分为几个步骤: 1. 将脚本文件(scripts文件夹)和配 ...

  4. Python 3 学习笔记之——基础语法

    1. a, b = a, a + b 先计算右边表达式,然后再同时赋值给左边. 2. 条件控制和循环语句 条件控制 if condition_1: statement_block_1 elif con ...

  5. php常见安全问题

    XSS攻击原理: XSS又叫CSS (Cross Site Script) ,跨站脚本攻击.它指的是恶意攻击者往Web页面里插入恶意html代码,当用户浏览该页之时,嵌入其中Web里面的html代码会 ...

  6. BZOJ 4276 [ONTAK2015]Bajtman i Okrągły Robin 费用流+线段树优化建图

    Description 有n个强盗,其中第i个强盗会在[a[i],a[i]+1],[a[i]+1,a[i]+2],...,[b[i]-1,b[i]]这么多段长度为1时间中选出一个时间进行抢劫,并计划抢 ...

  7. POJ 1703 Find them, Catch them（并查集拓展）

    Description The police office in Tadu City decides to say ends to the chaos, as launch actions to ro ...

  8. mysqldump: Got error: 1135: Can't create a new thread (errno 11); if you are not out of available memory, you can consult the manual for a possible OS-dependent bug when trying to connect 解决办法

    在进行数据库备份的时候发现服务器报 mysqldump: Got error: 1135: Can't create a new thread (errno 11); if you are not o ...

  9. Performanced C++ 经验规则

    http://www.cnblogs.com/ccdev/archive/2012/12/27/2836448.html Performanced C++,意为“高性能C++“编程,是笔者和所在团队多 ...

  10. 【python】实现一个python编程的小时钟！

    [本实验内容] 1.GUI.PyQT5介绍2.实现此次实验效果 [一 GUI.PyQt5介绍] 1.Python简介 2.GUI介绍 几个常用的Python GUI库: (1)wxPython (2) ...