Обеспечение запуска кода загрузки в событии jQuery, если присоединение события происходит после загрузки

Question

Я пытаюсь выяснить, как лучше всего прикрепить событие загрузки к элементу, но быть уверенным, что оно запускается.Проблема возникает, когда я связываюсь с событием загрузки IMG, но это связывание происходит слишком поздно, и изображение уже загружено.В jQuery есть какой-то способ проверить, загружено ли уже изображение?

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

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

Answer 1

Вы можете сделать это, используя .one() и .complete, например:

$('#image').one('load', function () {
    if ($(this).width() <= 0 || $(this).height() <= 0 || hasRun) return;
    hasRun = true;
    // do work here
}).each(function() {
  if(this.complete) $(this).trigger('load');
});

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