跨域IFRAME自适应高度(子页面TAB切换不同的高度,主页面IFRAME嵌套子页面自适应高度)


1、pinganproxy.html


<!DOCTYPE HTML><html lang="en-US"><head><meta charset="UTF-8"><title></title></head><body><script type="text/javascript">eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('8 u=9(d,f,g){d=d!=l?d+\'\':l;f=f||v.I;g=g==\'#\'?\'#\':\'?\';8 h={},j,n,2,i,7,5,w=(9(){m d?9(a,b){8 c;3(a[0]==b){c=a[1];3(c!=l){o{6=x(c)}p(e){6=c}}y{6=z 0}m 6}}:9(a){8 b;b=a[1];3(b!=l){o{h[a[0]]=x(b)}p(e){h[a[0]]=b}}}})();3(f.A(g)>-1){j=f.q(g)[1];7=j.A(\'#\');3(7>-1){j=j.J(0,7)}n=j.q("&");K(i=0,5=n.B;i<5;i++){2=n[i].q("=");7=w(2,d);3(7!=l){m 7}}}m d?z 0:h},4=u();C();9 D(){8 a=4.L,6,2,5;3(a&&(2=k.k.r.M(a))){6=2}y{2=k.k.r.N(\'O\');5=2.B;P(5--){3(2[5].Q==k){6=2[5];s}}}m 6}9 C(){8 a;o{R(4.S){E\'T\':U(\'V(k){\'+4.W+\'}\');s;E\'X\':3(~~4.F){r.F=v.Y.Z(/\\.(.*(\\.G\\.10|G)*)$/)[1]}3(a=D()){a.11.12+=\';t:\'+(4.t<+4.H?4.H:4.t)+\'13;\'}s;14:}15.16()}p(17){}}',62,70,'||temp|if|opts|len|result|cache|var|function||||||||||str|parent|null|return|strs|try|catch|split|document|break|height|getUrlValue|location|fn|decodeURIComponent|else|void|indexOf|length|setCrossSize|getCrossIframe|case|domain|com|minHeight|href|slice|for|fid|getElementById|getElementsByTagName|iframe|while|contentWindow|switch|comeform|ibearDoFunc|eval|with|action|ibearCross|hostname|match|cn|style|cssText|px|default|window|close|err'.split('|'),0,{}))</script></body></html>



http://pscript1.4008000000.com/app_js/speed/js/pinganproxy.js


/**

 * @Abstract    小熊跨域自适应框架

 * @Author      iBear

 * @Datatime    20120609

 * @Modified    20140928

 * @Version     0.3

 * @WebSite     http://jser.in

 * @Copyright   (c) ibear All Rights Reserved E-mail:[email protected] || [email protected]

 *

 *  子页面初始化调用函数,备注中还有*为可选参数,其余为推荐填写参数

ibearCross.start({

        host : 'baoxian.pingan.com',                            // 代理主域配置,缺省www.pingan.com

        url : 'baoxian.pingan.com/app_inc/pinganproxy.html',    //*代理文件配置,缺省为{{ host }}/app_inc/pinganproxy.html,如果填写url参数,则无需再指定host参数

        innerElem : $('#main')[0],                              // 内部计算高度所依赖的元素(使用这个会使计算高度时,更为精准,必须以body内部的某个元素来计算,例如body > div#main这样就计算#main的高度来自适应)

        fid : 'frame',                                          //*父页面iframe的id(写入id,轮询时能更加减少性能损耗)

        margin : 0,                                             //*底部预留的间距,缺省0(单位px,且无需写单位)

        delay : 400,                                            //*轮询时间段控制,缺省200ms

        domain : false,                                         //*是否需要重设代理domain为顶级无二级域

        minHeight : 0,                                          //*最小高度,缺省0(单位px,且无需写单位)

        autoHeight : true,                                      //*是否进行轮询,缺省true

        deep : false                                            //*是否深度计算高度,缺省false(目前版本支持尚不完美,不建议使用)

    });

 */

eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('~4(j,k,l){6 m=\'8\',8=j[m]||{},V=j.V||{1m:4(){}},C=D(\'C\');3(!C){C="1n-1o"}j[m]=8={L:5,x:\'/1p/1q.1r\',n:D(\'n\')||\'\',E:1,q:1s,y:\'1t.1u.1v\',W:5,1w:5,r:s,z:s,F:5,1x:s,M:\'8\',A:0,t:5,9:D(\'9\')||s,B:1y,X:4(a){a=a||{};2.y=a.y||2.y;2.x=a.x||Y.1z+\'//\'+2.y+2.x;2.n=a.n||2.n;2.A=a.A||2.A;2.q=a.q||2.q;2.z=!!a.z;2.9=a.9||2.9;2.B=a.B!==s;2.r=!!a.r||s;2.t=a.t||5},G:4(){6 a=0,i,o,7,r=2.r;3(r){7=k.7;o=7.N;i=o.Z;1A(i--){3(7.N[i].1B==1){a+=7.N[i].O}}}P{3(2.t){a=(10.11=="12 13 14")?2.t.H:2.t.H}P{a=(10.11=="12 13 14")?15.16(k.7.H,k.17.H):15.16(k.7.O,k.17.O)}}v a+2.A},18:4(u){2.L=2.Q(u);2.E++},19:4(a){3(a===R 0){a=2.G()}2.18("1a=1b&I="+a)},Q:4(u){6 a;3(a=k.1C(\'1c\')){k.7.1D(a)}6 b;b=k.1E(\'1F\');b.1G=\'1c\';b.1H=\'1I\';b.1J=2.x+\'?n=\'+8.n+\'&E=\'+8.E+(8.9?\'&9=\'+8.9:\'\')+(u?\'&\'+u:\'&1a=1b&I=\'+8.G())+\'&z=\'+~~2.z+\'&M=\'+2.M;b.1K.1L=\'1M:1d; 1e:0; I:0; 1f:1d; \';b.1e=b.I=b.1N=b.1f=0;v k.7.1O(b)},1P:4(b){6 c=2,o;2.X(b);1Q(2.F);c.L=2.Q();3(2.B||2.9){c.S=0;6 d=4(){6 a=c.G();3(c.S!=a){c.S=a;c.19()}3(c.B){c.F=1g(d,c.q)}};2.F=1g(d,2.q)}}};4 D(d,f,g){d=d!=5?d+\'\':5;f=f||Y.W;g=g==\'#\'?\'#\':\'?\';6 h={},w,J,o,i,p,T,1h=(4(){v d?4(a,b){6 c;3(a[0]==b){c=a[1];3(c!=5){1i{K=1j(c)}1k(e){K=c}}P{K=R 0}v K}}:4(a){6 b;b=a[1];3(b!=5){1i{h[a[0]]=1j(b)}1k(e){h[a[0]]=b}}}})();3(f.1l(g)>-1){w=f.U(g)[1];p=w.1l(\'#\');3(p>-1){w=w.1R(0,p)}J=w.U("&");1S(i=0,T=J.Z;i<T;i++){o=J[i].U("=");p=1h(o,d);3(p!=5){v p}}}v d?R 0:h}}(1T,1U);',62,119,'||this|if|function|null|var|body|ibearCross|minHeight||||||||||||||fid|temp|cache|delay|deep|false|innerElem||return|str|url|host|domain|margin|autoHeight|mathor_url|getUrlValue|aid|timer|getDocHeight|scrollHeight|height|strs|result|iframe_el|comeform|childNodes|offsetHeight|else|createFrame|void|old_height|len|split|console|href|setup|location|length|navigator|appName|Microsoft|Internet|Explorer|Math|max|documentElement|postAction|setHeight|action|setheight|AUTO_Iframe|none|width|border|setTimeout|fn|try|decodeURIComponent|catch|indexOf|log|iqsz|d0649|app_inc|pinganproxy|html|200|www|pingan|com|time|signA|true|protocol|while|nodeType|getElementById|removeChild|createElement|iframe|id|scrolling|no|src|style|cssText|display|frameborder|appendChild|start|clearTimeout|slice|for|window|document'.split('|'),0,{}))


==========================方案==============================

1、在父页面所在站点(生产环境 和 测试环境)根目录下的/app_inc/目录中放一个pinganproxy.html文件。

2、在子页面加入http://pscript1.4008000000.com/app_js/speed/js/pinganproxy.js 文件的引用。

3、再执行初始化方法

     ibearCross.start({

        host : ' 代理地址(如:pad-life-dmzstg1.pingan.com.cn)'

        innerElem : $('#main')[0],                              // 子页面内部计算高度所依赖的元素(使用这个会使计算高度时,更为精准,必须以body内部的某个元素来计算,例如body > div#main这样就计算#main的高度来自适应)

        minHeight : 0                                          //*最小高度,缺省0(单位px,且无需写单位)

});


黄色区域你要自己根据环境确定,host填顶层嵌套我们的页面域名

innerElem为需要计算高度的元素,如果要精准,就一定要加,传递原生dom对象


父页面的域名docshare.pingan.com.cn下要部署你发的附件作为代理页面(pinganproxy.html),子页面加载js并初始化就可以了



code


主页面:


<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="http://www.jb51.net/" />

<title>test</title>


<script type="text/javascript">

 //

</script>

</head>

<body>

<div style="height: 200px; background-color: #dbdbdb;">header</div>

<div style="width: 1200px; margin: 0 auto;">

<iframe src="http://test-www.xxx.com/zaixiangoumai/baoxian-lufax/guoneilvyoubaoxianzzytest.shtml?WT.mc_id=AHHS-LU-PC" width="100%" scrolling="no" allowTransparency="true" frameborder="0" id="autoIframe"></iframe>

</div>

<div style="height: 200px; background-color: #dbdbdb;">footer</div>

</body>

</html>


子页面:


<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="http://www.jb51.net/" />

<title>test</title>


<script type="text/javascript">

 //

</script>

</head>

<body>

<div id="main">

TAB切换,页面高度不一,实现主页自适应高度!

</div>


    <!--0516-->

    <script type="text/javascript" src="http://pscript1.4008000000.com/app_js/speed/js/pinganproxy.js"></script>

    <script type="text/javascript">

        $(document).ready(function(){

            ibearCross.start({host :"baoxian-dmzstg1.pa18.com",innerElem:$('#main')[0],minHeight:"0"});

        });

    </script>

    <!--0516-->


</body>

</html>


你可能感兴趣的:(跨域,iframe,适应)