Обнаружение загрузки изображения в jQuery 1.8+ - альтернатива load() с момента устаревания

Объяснение

По причинам, которые я понимаю, начиная с jQuery 1.8 событие load устарело, однако по-прежнему можно было определить, было ли загружено изображение (даже если оно было в кеше), просто используя определенные обходные пути. Поэтому прекращение поддержки события на самом деле довольно раздражает, поскольку оно представляет собой отправную точку, по крайней мере, для определения окончания загрузки изображения на страницу.

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

Пример (до jQuery 1.8)

Без использования плагина (поскольку это должно быть сделано в очень небольшом коде, поэтому плагин не нужен), я хотел бы вызывать функцию при загрузке каждого изображения на моей странице.

Что-то вроде этого (это не будет работать из-за устаревания):

$('#mn_content .column').on('load','img',function(){
    console.log('loaded');  
})

Мой вопрос

Кто-нибудь знает, как добиться этого сейчас, когда событие load не существует?

Обратите внимание: если единственным способом добиться этого (сейчас) является использование объектов Javascript new Image, то, пожалуйста, не тратьте свое время на помощь мне, так как другим нужна ваша помощь больше, чем мне. . Я могу написать этот код, просто он кажется немного затянутым для чего-то такого простого.

Я просто задал этот вопрос, чтобы убедиться, что нет способа добиться этого без использования объектов Javascript image

Конечно, я буду очень благодарен за любую помощь, я просто не хочу, чтобы вы тратили на меня много времени, когда другие нуждаются в вашей помощи больше. :-)


javascript image jquery jquery-events image-preloader
person Ben Carey    schedule 08.02.2013    source источник
comment
Ваш .each, по-видимому, повторяет только document, а не цели делегирования.   -  person Fabrício Matté    schedule 09.02.2013
comment
@FabrícioMatté Это очень хороший момент, пожалуйста, не обращайте на это внимания. Это не тот код, который я использовал, я написал его для иллюстрации и не тестировал. Но хорошо подмечено, +1 :-)   -  person Ben Carey    schedule 09.02.2013
comment
возможный дубликат метода load() устарел?   -  person Hannele    schedule 05.07.2015

Ответы (1)


arrow_upward
4
arrow_downward

Событие загрузки все еще существует, вы просто больше не можете привязываться к нему с помощью .load. Ваш пример делегирования событий должен продолжать работать в версиях 1.9 и 2.0 (если браузер, в котором вы тестируете, поддерживает всплывающую подсказку события загрузки).

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

Редактировать: извините, если я не понял, я хотел сказать, что событие загрузки все еще существует, вам просто нужно правильно привязаться к нему. Поскольку событие загрузки всплывает не во всех браузерах (если в любом браузере?), вы должны привязать событие непосредственно к изображению. Я бы предложил использовать метод, который вы просили не приводить вам в качестве примера.

person Kevin B    schedule 08.02.2013
comment
Я думал, что это может быть, но по какой-то причине это не сработало в моем сценарии. Я отлаживал свой код, не то, чтобы отлаживать было много, но я не мог заставить его работать. Я обновлю свой вопрос своим фактическим кодом. Спасибо за Ваш ответ :-) - person Ben Carey; 09.02.2013
comment
Я согласен с тем, что не все браузеры обязательно корректно работают, поэтому у меня есть запасной вариант complete - person Ben Carey; 09.02.2013
comment
Смотрите комментарий к вашему вопросу, ваша логика на .each() неверна, :) - person Kevin B; 09.02.2013
comment
А также, как сказал Кевин, если браузер не выдает событие load, ваш делегированный обработчик не сработает. - person Fabrício Matté; 09.02.2013
comment
@KevinB Да, но только потому, что я не тестировал этот код. Это было чисто для иллюстративных целей. Я опубликую код, который я фактически использовал в МО :-) - person Ben Carey; 09.02.2013
comment
@BenCarey Можете ли вы объяснить, где ваш обновленный код дает сбой? Это должно работать даже на кешированных изображениях, при условии, что событие загрузки правильно всплывает. Если событие не всплывает, вы не можете использовать делегирование события для его обработки. - person Kevin B; 09.02.2013
comment
@KevinB Событие просто не всплывает в DOM, в консоли ничего не регистрируется. Этот код работает с вами? Если это так, то проблема в другом месте моего кода, я посмотрю и посмотрю, смогу ли я отладить дальше - person Ben Carey; 09.02.2013
comment
Я не проверял это сам, я ожидаю, что он не будет работать во всех браузерах из-за проблемы с пузырями. - person Kevin B; 09.02.2013
comment
Что в значительной степени означало бы, что вам нужно использовать другой метод, пример которого вам не нужен. :-) - person Kevin B; 09.02.2013
comment
@KevinB Вы уверены, что событие load все еще существует? Я создал следующий jsFiddle, и он просто не работает... Есть идеи? jsfiddle.net/ajc7J/1 - person Ben Carey; 10.02.2013
comment
Это по-прежнему использует делегирование событий, которое требует, чтобы событие всплывало. событие загрузки не всплывает. См. здесь: jsfiddle.net/ajc7J/2 - person Kevin B; 10.02.2013
comment
@KevinB А, понятно!! Был в полусне!! Конечно, событие загрузки не всплывает!! Спасибо, Кевин, теперь все в порядке :-) - person Ben Carey; 11.02.2013