快捷導(dǎo)航

js下判斷 iframe 是否加載完成的完美方法

更新時(shí)間：2010年10月26日 13:43:44 作者：

一般來說，我們判斷 iframe 是否加載完成其實(shí)與判斷JavaScript 文件是否加載完成。

采用的方法很類似：

 
var iframe = document.createElement("iframe"); 
iframe.src = "http://www.fzitv.net"; 

if (!/*@cc_on!@*/0) { //if not IE 
iframe.onload = function(){ 
alert("Local iframe is now loaded."); 
}; 
} else { 
iframe.onreadystatechange = function(){ 
if (iframe.readyState == "complete"){ 
alert("Local iframe is now loaded."); 
} 
}; 
} 
document.body.appendChild(iframe); 

最近， Nicholas C. Zakas 文章《Iframes, onload, and document.domain》的評(píng)論中 Christopher 提供了一個(gè)新的判斷方法（很完美）：

復(fù)制代碼代碼如下:

 
var iframe = document.createElement("iframe"); 
iframe.src = "http://sc.jb51.net"; 
if (iframe.attachEvent){ 
iframe.attachEvent("onload", function(){ 
alert("Local iframe is now loaded."); 
}); 
} else { 
iframe.onload = function(){ 
alert("Local iframe is now loaded."); 
}; 
} 
document.body.appendChild(iframe); 

幾點(diǎn)補(bǔ)充說明：

IE 支持 iframe 的 onload 事件，不過是隱形的，需要通過 attachEvent 來注冊(cè)。
第二種方法比第一種方法更完美，因?yàn)?readystatechange 事件相對(duì)于 load 事件有一些潛在的問題。

您可能感興趣的文章:

相關(guān)文章

JavaScript前端實(shí)現(xiàn)拼圖分割效果
這篇文章主要為大家詳細(xì)介紹了如何通過JavaScript前端實(shí)現(xiàn)拼圖分割效果,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下
2024-10-10
JavaScript檢測(cè)字符串中是否含有html標(biāo)簽實(shí)現(xiàn)方法
這篇文章主要介紹了JavaScript檢測(cè)字符串中是否含有html標(biāo)簽實(shí)現(xiàn)方法,本文直接給出實(shí)現(xiàn)代碼,需要的朋友可以參考下
2015-07-07
微信小程序入門之廣告條實(shí)現(xiàn)方法示例
這篇文章主要介紹了微信小程序入門之廣告條實(shí)現(xiàn)方法,涉及微信小程序基于swiper與navigator組件的文字信息滑動(dòng)展示相關(guān)操作技巧,需要的朋友可以參考下
2018-12-12
webpack如何自動(dòng)生成網(wǎng)站圖標(biāo)詳解
這篇文章主要給大家介紹了關(guān)于webpack如何自動(dòng)生成網(wǎng)站圖標(biāo)的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
2022-01-01
開啟BootStrap學(xué)習(xí)之旅
當(dāng)下最流行的前端開發(fā)框架Bootstrap，可大大簡(jiǎn)化網(wǎng)站開發(fā)過程，從而深受廣大開發(fā)者的喜歡，你如果也喜歡Bootstrap前端開發(fā)框架，不要錯(cuò)過這次旅行
2016-05-05
JavaScript forEach()遍歷函數(shù)使用及介紹
這篇文章主要介紹了JavaScript forEach()遍歷函數(shù)使用及介紹,本文講解了使用forEach遍歷數(shù)組的用法以及提前終止循環(huán)的一個(gè)方法技巧,需要的朋友可以參考下
2015-07-07
一篇文中告訴你JS中的"值傳遞"和"引用傳遞"
在JavaScript中,可以通過值和引用傳遞,兩者之間的主要區(qū)別是,按值傳遞發(fā)生在賦值基本類型的時(shí)候,而賦值對(duì)象時(shí)按引用傳遞,下面這篇文章主要給大家介紹了關(guān)于JS中"值傳遞"和"引用傳遞"的相關(guān)資料,需要的朋友可以參考下
2022-05-05
基于javascript實(shí)現(xiàn)瀏覽器滾動(dòng)條快到底部時(shí)自動(dòng)加載數(shù)據(jù)
這篇文章主要介紹了基于javascript實(shí)現(xiàn)瀏覽器滾動(dòng)條快到底部時(shí)自動(dòng)加載數(shù)據(jù)的相關(guān)資料,需要的朋友可以參考下
2015-11-11
ES6標(biāo)準(zhǔn) Arrow Function（箭頭函數(shù)=>）
ES6標(biāo)準(zhǔn)新增了一種新的函數(shù)：Arrow Function（箭頭函數(shù)）,為什么叫Arrow Function？因?yàn)樗亩x用的就是一個(gè)箭頭
2020-05-05
javascript檢測(cè)移動(dòng)設(shè)備橫豎屏
移動(dòng)端的開發(fā)過程中，免不了要判斷橫豎屏，然后在執(zhí)行其他操作，比如分別加載不同樣式，橫屏顯示某些內(nèi)容，豎屏顯示其他內(nèi)容等等。
2016-05-05