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

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

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

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

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

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

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

Любые идеи?


javascript image image-preloader
person Community    schedule 28.05.2009    source источник
comment
Что не кажется означающим? Вы проверяли, предварительно загружены они или нет? Также я бы опубликовал полный код, который вы используете для предварительной загрузки. Этот вопрос не дает достаточно информации, чтобы ответить на него.   -  person John Farrell    schedule 28.05.2009
comment
Для чего нужны ваши изображения? Ваша проблема может быть частично решена путем создания больших изображений со всеми изображениями, которые вы хотите предварительно загрузить, но это зависит от того, с какими изображениями вы работаете и для чего.   -  person Fabien Ménager    schedule 28.05.2009

Ответы (1)


arrow_upward
1
arrow_downward

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

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

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

Да, это возможно. Вы можете использовать обработчик событий 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';
person Rafael    schedule 28.05.2009