Иногда вам нужно получить размер изображения, который необходимо загрузить после загрузки изображения. Ниже редактор составил резюме нескольких методов оценки того, загружается ли изображение JS. Давайте посмотрим.
1. Загрузить событие
<script type = "text/javascript"> $ ('img'). onload = function () {// code} </script>Преимущества: простые и простые в использовании, не влияя на код HTML.
Недостатки: может быть указан только один элемент, и код Javascipt должен быть размещен ниже элемента изображения
2. Метод jQuery
<script type = "text/javascript"> $ (function () {$ ('. Pic1'). Каждый (function () {$ (this) .load (function () {$ (this) .fadein ();});});}) </script>Обратите внимание, что не связывайте событие загрузки в $ (document) .ready ().
Преимущества: события элементов могут быть связаны партиями и не влияют на содержание кода HTML
Недостатки: требуется поддержка библиотеки jQuery, и код должен быть размещен ниже элемента, который необходимо управлять.
3. Событие ReadyStateChange
<! Doctype html> <html> <head> <meta charset = "utf -"> <Title> img - readyStateChange Event </title> </head> <body> <img id = "img" src = "http://pic.win.com/wallppaper/f/cbbae.jpg"> <p й идентификатор. type = "text/javascript"> img.onreadyStateChange = function () {if (img.readyState == "complete" || img.readyState == "Loaded") {p.innerhtml = 'readyStateChange: загружен'}} </script> </body> </html>Готовая площадка завершена и загружена, что означает, что изображение было загружено. Тестирование IE6-IE10 поддерживает это событие, а другие браузеры-нет.
4. Полный атрибут IMG
<! Doctype html> <html> <head> <meta charset = "utf -8"> <Title> Img - Полный атрибут </title> </head> <body> <img id = "img1" src = "http://pic1.win4000.com/wallpaper/f/51c3b99a21a. id = "p1"> загрузка ... </p> <script type = "text/javascript"> function imgload (img, callback) {var timer = setInterval (function () {if (img.complete) {callback (img) clearInterval (timer)}}, 50)} imglote (img1, funct {p1.innerhtml ('loaded')}) </script> </body> </html>Опрос постоянно контролирует полный атрибут IMG. Если это правда, это означает, что изображение было загружено, а опрос остановлен. Это свойство поддерживается всеми браузерами.
Приведенное выше содержание является краткой методом JS, чтобы определить, загружается ли изображение редактором. Я надеюсь, что это будет полезно для всех. В то же время я хотел бы поблагодарить вас за вашу поддержку веб -сайта Wulin Network!