javascript - 从 jquery 嵌套函数更新全局变量

Question

我对这段代码有疑问:

var elements;
var current = 100;

$(document).ready(function() {
        elements =  = $('.slide').length;
        iterate();
});

function iterate() {
        $('.slide').eq(current).hide().queue(
                function() {
                        if (++current >= elements) { current = 0; }
                        $('.slide').eq(current).show();
                        $(this).dequeue();
                }
        );

        // Call this function again after the specified duration
        setTimeout(iterate, 1000);
}

我想做的是迭代具有“幻灯片”类的所有元素，但更新“当前”变量时遇到问题。它的值始终为 0。如何从嵌套 jquery 函数内部修改全局变量？

Answer 1

如果在 DOM 准备好之前调用此行，.length是 0 :

var elements = $('.slide').length;

这意味着if的条件永远是true :

if (++current >= elements) { current = 0; }

你可以这样修复它:

var elements;
var current = 100;

$(document).ready(function() {
    elements = $('.slide').length;
    iterate();
});

此外，.queue() 的使用有点奇怪。 。没有什么需要排队的。

我会像这样重新设计:

function iterate() {
    var slide = $('.slide').eq(current).hide();
    if (++current >= elements) { current = 0; }
    $('.slide').eq(current).show();

    // Call this function again after the specified duration
    setTimeout(iterate, 1000);
}