Как проверить, что все изображения в массиве загружены

0

У меня есть массив, содержащий ряд изображений, и мне нужно проверить, загружены ли все изображения и вернуть true, когда все они были загружены, прежде чем продолжить. Пока у меня есть:

var image = new Array();
var c=0;
jQuery('.banner-images img').not('.sizer').each(function() {
    image[c] = new Image();
    image[c].src=jQuery(this).attr('src');
    c++;
});
var fc = image.length;
for(i=0;i<fc;i++) {
    // ???
}

Я не знаю, где взять это оттуда. Какие-либо предложения?

Показать ещё 2 комментария
Теги:

4 ответа

0
Лучший ответ

Подключите обработчик onload к новому изображению, чтобы вызвать функцию для увеличения счетчика. Когда счетчик имеет одинаковый размер массива, это делается.

0

Нет встроенного javascript-способа, но здесь хороший способ

https://github.com/desandro/imagesloaded

0

Вы должны знать, что, когда код прекратил выполнение (когда все загрузилось или появилась ошибка), функция возвращает true, если вы не настроите ее на обработку некоторых ошибок.

Однако вы можете предотвратить выполнение других действий до загрузки изображения с помощью функции preventDefault().

  • 0
    Какое отношение имеет загрузка изображений к Ajax?
  • 0
    Извините, я не понял
Показать ещё 1 комментарий
0

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

function load(files, callback)
{
    var args = Array.prototype.slice.call(arguments);
    var loadedFiles = [];
    var load = Function.prototype.bind.apply(callback, [callback,loadedFiles].concat(args.slice(2)));
    for(var i = files.length;i--;)
    {
        load = (function(f, i)
        {
            return function()
            {
                // console.log('Loading '+(i+1)+'.');
                var file = new Image();
                loadedFiles.push(file);
                file.onload = f;
                file.src = files[i];
            };
        })(load, i);
    }
    load();
}

// And then you use it like this
// load(['a.jpg', 'b.jpg'], function(files, extraValue1){console.log('loaded');}, 'anything')

Вот пример, который может помочь вам понять: http://jsfiddle.net/uN5m9/.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню