Как контролировать источник изображения для полностью загруженного статуса

Я загружаю большое количество изображений в динамический DIV и использую предварительный загрузчик для получения изображений.

imageObj = new Image();
imageObj.src = imgpath + imgname;

Каждое из этих событий создает GET, который я могу видеть и отслеживать в Firebug.

Если я знаю имя и путь к изображению, могу ли я просмотреть соответствующий запрос XMLHttpRequest, чтобы убедиться, что GET завершен?

Я не хочу полагаться на (или использовать) .onload события для этого процесса.

Псевдо будет выглядеть примерно так ...

if (imageObj.GET = 'complete')

Кто-нибудь имел опыт этого?

РЕДАКТИРОВАТЬ 1

Благодаря помощи от Барта (см. Ниже) я изменил свой предварительный загрузчик изображений для хранения массива объектов изображений ...

function imagePreLoader(imgname) {
    images[imgnum] = new Image();
    images[imgnum].src = imgpath + imgname;// load the image
    imgnum ++;
}

И затем, после того, как все мои другие функции были запущены для создания содержимого DIV, я использовал атрибут image.complete в следующем ...

var interval = setInterval(function () {
    imgcount = imgnum - 1; // because the imgnum counter ++ after src is called.
    ok = 1;

    for (i=0; i
 Bart21 мая 2013 г., 11:44
Просто написал простойjquery.preload плагин, чтобы воспользоватьсяimage.complete имущество. Надеюсь, что это может быть полезно для вас.
 TJS10120 мая 2013 г., 13:53
Событие .onload срабатывает до завершения GET. Я хочу отслеживать состояние только сгенерированного GET. Элементы GET видны в Firebug, мне нужно получить доступ к этой информации в JS.
 TJS10121 мая 2013 г., 17:03
Хороший код, Барт, но здесь я свободная зона .js! Спасибо за вашу помощь, хотя. Было бы неплохо добавить код в ответ ...?
 Cherniv20 мая 2013 г., 13:50
Что вы подразумеваете под "смотреть соответствующий XMLHttpRequest "? ты пытаешься поймать образсобытие загрузки?

Ответы на вопрос(2)

и я боюсь, что нет реального решения этой проблемы.load Событие для изображений - это когда изображение визуализируется, и браузер знает его ширину и высоту.

То, что вы будете после, будет применимо к тегуreadystatechange событие. Увы, только IE позволяет связывать их с элементами без документов, так что это не вариант.

Существует множество плагинов, которые также позволяют вам обойти это. Один довольно горячий одинhttps://github.com/desandro/imagesloaded , что имеет дополнительное преимущество в том, что очень эффективно справляется со всеми различиями браузера. Это, однако, все еще опирается наload событие (и я уверен, что это единственный способ начать делать то, что вы хотите сделать).

 TJS10120 мая 2013 г., 22:32
Проблема решена без плагинов. Молодец Барту за то, что он поместил меня в атрибут image.complete.
Решение Вопроса

complete свойство изображения, чтобы видеть, загружено ли изображение полностью или нет.

Вот'Это пример.

http://jsfiddle.net/t3esV/1/

function load (source) {
    var img = new Image();
    img.src = source;

    console.log('Loading ' + source);

    var interval = setInterval(function () {
        if (img.complete) {
            clearInterval(interval);
            complete(img);
        }
    }, 400);
};

function complete(img) {
    console.log('Loaded', img.src);
    document.body.appendChild(img);
};

Примечание: этот пример не может очистить интервал, когда что-то идет не так иcomplete никогда не устанавливается на.true

Обновить

Я написал простуюплагин jQuery.preload воспользоватьсяimage.complete имущество.

 Dex27 мая 2014 г., 09:50
Это не будет определять, если изображение не загружается, хотя. Только что закончил пытаться загрузить. Похоже, это может быть лучшим ответом:stackoverflow.com/a/14226702/148390
 Bart20 мая 2013 г., 15:23
Я понимаю вашу точку зрения. Обновил мой ответ до более подходящего решения.
 TJS10120 мая 2013 г., 17:40
Спасибо, Барт. Я смотрю на свойство img.complete. Вам повезло с подходом img.complete = function ()?
 TJS10120 мая 2013 г., 14:48
потому что изображения запускают свои события .onload, прежде чем они будут полностью загружены и готовы к отображению. Особенно, если вы добавляете их динамически в виде строки HTML в DIV.innerHTML.
 TJS10120 мая 2013 г., 14:40
Функция .onload срабатывает до завершения GET. Журнал Firebug ясно показывает, что GET завершаются через 11 секунд, но .onload срабатывает через 5 секунд. Я не хочу использовать .onload. Пожалуйста, смотрите текст вопроса.
 TJS10120 мая 2013 г., 22:28
Nice One Bart - см. Мое редактирование.
 Bart27 мая 2014 г., 11:45
@Dex вопрос о том, чтобы определить, загружено ли изображение. onload () не будет запускаться для кэшированных изображений. Вот почему мой ответ имеет смысл.

Ваш ответ на вопрос