последовательное выполнение javascript - отложенный объект и т. д.

0

Мне нужно подсчитать количество изображений, загруженных на страницу через определенный промежуток времени (скажем, 6 секунд), затем нужно выполнить некоторую обработку. Таким образом, через 6 секунд я вызываю функцию scan_images_results().

function scan_images_results ( ) {
   $.when(count_loaded_image()).then(function() {
    window.console.log("i m here");
    });
}

function count_loaded_image() {
    var counter = 0;
    $('img[id^="picThumbImg_"]').imagesLoaded()
        .progress( function( instance, image ) {
            var result = image.isLoaded ? 'loaded' : 'broken';
            console.log( 'image is ' + result + ' for ' + image.img.src );
        if(image.isLoaded) {
            counter++;
        }

        });

    console.log('counter--'+counter);
}

Выходные данные приведены ниже.

counter--0
i m here
image is broken for https://myserver/cgi-bin/sf?f=58343d875e7a10290d0464cabfc276e5.jpg
image is broken for https://myserver/cgi-bin/sf?f=68343d875e7a10290d0464cabfc276e6.jpg
image is broken for https://myserver/cgi-bin/sf?f=78343d875e7a10290d0464cabfc276e7.jpg
.........
........ 28 times 

Я использую " https://github.com/desandro/imagesloaded ", чтобы проверить, загружен ли образ или нет. Я получаю 28 изображений, которые являются правильными. Но моя функция счетчика выполняется позже. выход

image is broken for https://myserver/cgi-bin/sf?f=58343d875e7a10290d0464cabfc276e5.jpg
image is broken for https://myserver/cgi-bin/sf?f=68343d875e7a10290d0464cabfc276e6.jpg
image is broken for https://myserver/cgi-bin/sf?f=78343d875e7a10290d0464cabfc276e7.jpg
.........
........ 28 times 
counter--0
I m here

Я знаю, где проблема? Мне нужно выполнить функцию последовательно, и для этого мне нужно создать Отложенные объекты. Но я не мог исправить свою проблему.

  • 0
    scan_images_results не возвращает объект обещания, поэтому передавать его в $ .when бессмысленно.
  • 0
    Скорее всего, вам просто нужно return $('img[id^="picThumbImg_"]').imagesLoaded()
Теги:

1 ответ

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

Вам не нужно $.when вам даже не нужна дополнительная функция.

function scan_images_results() {
    var counter = 0;
    $('img[id^="picThumbImg_"]').imagesLoaded()
        .progress(function (instance, image) {
            var result = image.isLoaded ? 'loaded' : 'broken';
            console.log('image is ' + result + ' for ' + image.img.src);
            if (image.isLoaded) {
                counter++;
            }

        })
        .always(function () {
            console.log("I'm here");
        });

    console.log('counter--' + counter);
}

и если вы хотите сохранить функцию,

function scan_images_results() {
    count_loaded_image().always(function () {
        console.log("I'm here");
    });
}

function count_loaded_image() {
    var counter = 0;
    return $('img[id^="picThumbImg_"]').imagesLoaded().progress(function (instance, image) {
        var result = image.isLoaded ? 'loaded' : 'broken';
        console.log('image is ' + result + ' for ' + image.img.src);
        if (image.isLoaded) {
            counter++;
        }
    });
}
  • 0
    Спасибо за помощь .. Так что вы используете всегда загруженное изображение здесь. Я только что поместил 'console.log (' counter-- '+ counter);' внутри всегда событие только как ниже. Это как и ожидалось. .always (function () {console.log («Я здесь»); console.log («counter--» + counter);});
  • 0
    Да, я использовал всегда, потому что в зависимости от выходного сигнала, который вы видите, не будет вызвано сообщение done, только сбой, и всегда, поскольку некоторые изображения загружаются неправильно.
Показать ещё 7 комментариев

Ещё вопросы

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