資源描述:
《用jquery進(jìn)行修復(fù)在iframe下的頁面錨點(diǎn)失效問題》由會(huì)員上傳分享,免費(fèi)在線閱讀,更多相關(guān)內(nèi)容在工程資料-天天文庫。
1、用jquery進(jìn)行修復(fù)在iframe下的頁面錨點(diǎn)失效問題應(yīng)用場景是:iframe頁面沒有滾動(dòng)條,在父窗體中出現(xiàn)滾動(dòng)條,錨點(diǎn)標(biāo)記就會(huì)失效,因?yàn)?,錨點(diǎn)是根據(jù)當(dāng)前窗口滾動(dòng)條滾動(dòng)窗口的,成為子窗體后沒有了滾動(dòng)條,自然不會(huì)滾動(dòng)。解決辦法是:用js判斷頁面是否被嵌套,用js計(jì)算iframe在父窗體位置,錨點(diǎn)在firame中的位置,兩者相加成為父窗體的滾動(dòng)。遇到問題:獲取父窗體元素(因?yàn)橛杏蛳拗疲行枰诰W(wǎng)絡(luò)環(huán)境下方位(即));父窗體嵌套多個(gè)iframe,判斷是否是當(dāng)前iframe頁面。代碼如下:父窗體頁面index.html復(fù)制代碼代碼如下:It;!doctypeh
2、tmlgt;1tjhtmlgt;It;headgt;1t;titlegt;1t;/titlegt;It;styletype=text/cssgt;*{margin:0;padding:0:border:0;}html,body{width:100%;height:100%;}It;/stylegt;It;/headgt;It:divstyle=width:100%;background:#f00;height:500px;gt;It;/divgt;It:ahref=gt;ddlt;/agt;It;ahref=gt;dddlt;/agt;c=iframe?h
3、tlt;iframename=ifra.me2id=iframe2srml?a=bamp;c=dstyle二width:100%;height:2060px;gt;It;/iframegt;It;iframename=iframe2id=iframe2src=iframe?html?a=damp;c=bstyle=width:100%;height:2060px;gt;1t;/iframegt;It;/bodygt;It:/htmlgt;子窗體頁面iframe.html復(fù)制代碼代碼如下:It;!doctypehtmlgt;Itjhtmlgt;1t;head
4、gt;It;titlegt;lt;/titlegt;It;styletype=text/cssgt;a{padding:5px;border:lpxsolid#f00;float:left;display:block;margin-right:5px;}div{width:80%;margin:lOpxauto;height:50Opx;border:lpxsolid#f00;font-size:30px;It;/stylegt;1t;scripttype二text/javascriptsrc=jquery-1.8.2.min.jsgt;1t;/scrip
5、tgt;It;scripttype=text/javascriptgt;$(function(){//如果是iframe則需要在網(wǎng)絡(luò)中訪問,因?yàn)閖s里有域限制//如果沒有iframe則不進(jìn)行處理,if(window!==window.top){//獲取top窗口中的iframe,如果有iframe嵌套過多,請(qǐng)自行修改variframe1ist=window?top.document?getelementsbytagnameCiframe5);for(vari=0;ilt;iframelist.length;i++){//判斷當(dāng)前窗口是否循環(huán)中的iframe
6、if(window.location.tostring()?indexof(iframelist[i]?getattribute('src')?tostring())!=-1){//等自己的所在iframe加載完成給a錨點(diǎn)加事件window.top?document?getelementsbytagnameCiframe,)[i]?onload二function(){//確定iframe在父窗體的距頂部距離vartop=window.top.document.getelementsbytagnameCiframe')[i]?offsettop;$('a')
7、.each(function(){varhref=$(this).attr('href');if(href.indexof('#')!=T){//判斷是否是錨點(diǎn)而不是鏈接varname=href?substring(href?indexof(')+1);$(this).bindCclick',function(){$C).each(funotion(){if($(this)?attrCname')==name){//父窗口滾動(dòng)$(window.parent)?scrolltop($(this)?offset().top+top);}});});}});})
8、;It;/scriptgt;It;/headgt;It;bodyg