首頁  >  文章  >  web前端  >  JavaScript怎麼判斷圖片是否已載入完成以便取得其尺寸_javascript技巧

JavaScript怎麼判斷圖片是否已載入完成以便取得其尺寸_javascript技巧

WBOY
WBOY原創
2016-05-16 16:49:201121瀏覽

有時需要取得圖片的尺寸,這需要在圖片載入完成以後才可以,求方法?

一、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() { p1.inHTner ('加載完成') }) 輪詢不斷監測img的complete屬性,如果為true則表示圖片已經載入完畢,停止輪詢。該屬性所有瀏覽器都支援。
陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn