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. HDU 5794 A Simple Chess Lucas定理+dp

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5794 题意概述: 给出一个N*M的网格.网格上有一些点是障碍,不能经过.行走的方式是向右下角跳马步.求 ...

  2. css制作环形文本

    css制作环形文本 在项目开发中,我们可能会遇到环形文本的需求,这个时候,怎样在代码以通俗易懂的前提下实现我们需要的效果呢?可能你会想到用一个一个的span元素计算出旋转的角度然后拼接起来,这个方案不 ...

  3. const在c/c++中的区别

    #include <iostream> using namespace std; int main() { ; ; }; ; i < sizeof array / sizeof *a ...

  4. javascript中将整数添加千位符号

    如果num是整数的话,将其转换成带千位符号的字符串: Number(num).toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1' +  ','); 另 ...

  5. C#判断字符串是否为数字字符串

    在进行C#编程时候,有的时候我们需要判断一个字符串是否是数字字符串,我们可以通过以下两种方法来实现.[方法一]:使用 try{} catch{} 语句.      我们可以在try语句块中试图将str ...

  6. 【题解】[WC2006]水管局长

    感觉这题好强啊……本来以为能过,结果毫无疑问的被ge了一顿……在这里记录一下做的过程,也免得以后又忘记啦. 首先,我们应看出在这张图上,要让经过的水管最长的最短,就是要维护一棵动态的最小生成树.只是删 ...

  7. [SCOI2010]序列操作 线段树

    ---题面--- 题解: 在考场上打的这道题,出人意料的很快就打完了?! 直接用线段树,维护几个东西: 1,lazy标记 : 表示区间赋值 2,mark标记:表示区间翻转 3,l1:前缀最长连续的1的 ...

  8. Codeforces Round #430 (Div. 2) Vitya and Strange Lesson

    D.Vitya and Strange Lesson(字典树) 题意: 给一个长度为\(n\)的非负整数序列,\(m\)次操作,每次先全局异或\(x\),再查询\(mex\) \(1<=n< ...

  9. cdh版本的hadoop安装及配置(伪分布式模式) MapReduce配置 yarn配置

    安装hadoop需要jdk依赖,我这里是用jdk8 jdk版本:jdk1.8.0_151 hadoop版本:hadoop-2.5.0-cdh5.3.6 hadoop下载地址:链接:https://pa ...

  10. timeSetEvent()函数

    原文链接地址:http://www.cnblogs.com/kangwang1988/archive/2010/09/16/1827872.html 微软公司在其多媒体Windows中提供了精确定时器 ...