Задержка jquery меняет закрытие очереди? - PullRequest
1 голос
/ 05 марта 2011

У меня есть очень простая тестовая страница, которая проверяет очередь и задержку jquery (1.4.2).

    for (var i = 1; i <= 5; i++) {
        $('#test')
        //.delay(50)
        .queue(function(next) {
            console.log(i);
            next();
        });
    }

Теперь, когда я запускаю этот код в FF с firebug, я получаю то, что ожидал, 1 ~5.

Однако, если я откомментирую задержку, вместо этого я получу 6 раз?

Может кто-нибудь помочь мне уточнить это?

Ответы [ 3 ]

5 голосов
/ 05 марта 2011

i - это одна переменная, хранящаяся один раз и совместно используемая всеми итерациями цикла. Без .delay() вы используете значение i прямо тогда , так что это то, что вы ожидаете. С .delay() однако вы используете значение, равное , позже ... и позже это то, чем оно закончилось, как в конце петля, 6.

4 голосов
/ 05 марта 2011

@ Ник дает превосходное объяснение для , почему ведет себя так:

Для полноты вы можете «исправить» это, фиксируя текущее значение i в новом объеме.JavaScript имеет только область действия функции, поэтому вы должны использовать функцию для захвата значения.Например, вы можете использовать немедленную функцию :

for (var i = 1; i <= 5; i++) {
    $('#test')
    .delay(50)
    .queue((function(index) {
        return function(next) {
            console.log(index);
            next();
        }
    }(i))); // <- function gets called directly with `i` and the returned
            //    function is passed to queue.
}

DEMO

0 голосов
/ 05 марта 2011

Хорошо для следующего кода в консоли firebug на stackoverflow

for (var i = 1; i <= 5; i++) {
    $('#custom-header')
        //.delay(50)
        .queue(function(next) {
        console.log(i);
        next();
        });
}

На консоли вы получите результат

1
2
3
4
5
[div#custom-header]

И для кода

for (var i = 1; i <= 5; i++) {
    $('#custom-header')
        .delay(50)
        .queue(function(next) {
        console.log(i);
        next();
        });
}

Youполучить результат

[div#custom-header]
6
6
6
6
6

[Объяснение]:

Из этого можно сделать вывод, что dealay(50) задерживает оценку функции внутри очереди, поэтому сначала печатается [div#custom-header] и iпечатается все 6 (на данный момент), потому что цикл (который не задерживается) вычисляется первым (задерживается только функция печати внутри очереди).

...