首頁 > web前端 > js教程 > 使用JavaScript判斷圖片是否載入完成的三種實作方式_javascript技巧

使用JavaScript判斷圖片是否載入完成的三種實作方式_javascript技巧

WBOY
發布: 2016-05-16 16:50:17
原創
1292 人瀏覽過

有時需要取得圖片的尺寸,這需要在圖片載入完成以後才可以。有三種方式實現,下面一一介紹。

一、load事件

複製程式碼 程式碼如下:





img - load event


使用JavaScript判斷圖片是否載入完成的三種實作方式_javascript技巧

loading. ..






測試,所有瀏覽器都顯示出了“loaded”,說明所有瀏覽器都支援img的load事件。

二、readystatechange事件
複製程式碼 程式碼如下:









img - readystatechange event


使用JavaScript判斷圖片是否載入完成的三種實作方式_javascript技巧

loading. ..


}



readyState為complete和loaded則表示圖片已載入完畢。測試IE6-IE10支援該事件,其它瀏覽器不支援。 三、img的complete屬性
複製程式碼


程式碼如下:



程式碼如下:




img - complete attribute


使用JavaScript判斷圖片是否載入完成的三種實作方式_javascript技巧

loading...


imgLoad(img1, function() {
}
imgLoad(img1, function() { 使用JavaScript判斷圖片是否載入完成的三種實作方式_javascript技巧p1.inHTner ('加載完成') }) 輪詢不斷監測img的complete屬性,如果為true則表示圖片已經載入完畢,停止輪詢。該屬性所有瀏覽器都支援。  
相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板