Проверьте, кэшировано ли уже изображение с помощью jQuery

Question

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

Если изображение уже кэшировано, мне ничего не нужно.Есть ли способ проверить, находится ли он в кеше?

Спасибо, Уэсли

Answer 1

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

Я использовал window.setTimeout () с задержкой в ​​200 мс, который вызвал мой эффект предварительного загрузчика, и в событии .load () для загружаемого изображения первое, что он делает - очищает тайм-аут, поэтому, если загрузка была быстрой - эффект не отображается, но если загрузка изображения занимает более 200 мс, отображается предварительный загрузчик:

var imgTmr;

imgTmr = window.setTimeout(function() {showLoading('zoomImage');}, 200);

$("#zoomImage").load(function() {
    window.clearTimeout(imgTmr);
    hideLoading();
}

$("#zoomImage").attr("src", "myLargeImage.jpg");

// The showLoading() and hideLoading() functions just display a wait graphic 
// the image being loaded in this instance has the id of zoomImage

Answer 2

Обычно я просто оставляю событие загрузки на месте.Даже когда изображение кэшируется, его загрузка с компьютера занимает несколько миллисекунд (в зависимости от размера и скорости обработки на компьютере).Загрузка по-прежнему происходит только не из того же источника.Поэтому к нему должно быть привязано событие загрузки, кэшировано оно или нет.