Возникли проблемы с предварительной загрузкой изображений с помощью JavaScript

Question

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

1) Изображения предварительно загружаются с использованием списка имен файлов. Не каждое имя файла в списке имеет файл, который ему соответствует.

например) pic04.jpg может не существовать, даже если он находится в списке.

Поэтому, когда я загружаюсь заранее, я бы хотел выяснить, существует ли изображение, если это возможно.

2) Сейчас функция просто загружает все 150 изображений, используя картинки [я] = новое изображение (); pictures [i] .src = "путь / к / my / images /" + imageName [i] + ".jpg";

Функция выполняется очень быстро, но изображения, похоже, не были предварительно загружены. Нужно ли что-то делать, чтобы сайт дождался загрузки изображений, прежде чем продолжить?

Есть идеи?

Answer 1

Функция выполняется очень быстро, но кажется, что изображения не были предварительно загружены.

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

Поэтому, когда я загружаюсь заранее, я бы хотел выяснить, существует ли изображение, если это возможно.

Да, это возможно. Вы можете использовать обработчик события onerror для объекта Image

var img = new Image();
img.onerror=function(){alert('error: '+this.src);}
img.onload=function(){alert('image loaded: '+this.src);}
img.src='path/to/image.jpg';