Question

我希望使用jQuery fadeIn函数淡化页面逐个的不同元素。它正在工作，但两个fadeIn之间的延迟并不一致。随机地，一些元素比其他元素更快出现。我究竟做错了什么？我正在使用以下代码来实现这一目标。

setInterval(function(){
    $('.showTime .appr').each(function(index){
        $(this).delay(500*index).fadeIn(400);
    });
}, 50);

注意：使用setInterval函数是因为我正在等待通过其他函数将类“showTime”添加到body标记中。

Answer 1

通过使用setInterval()，即使在添加了.showTime类之后，也会导致每隔50ms调用此代码，这会导致您看到的奇怪行为。如果将setInterval()的结果分配给变量，则可以在添加类后使用clearInterval()，并且选择器返回DOM元素：

// track the interval so we can clear it
var myInterval;
myInterval = setInterval(function(){
    // try to match elements with the selector
    var elements = $('.showTime .appr');
    // if the length is non-zero...
    if ( elements.length ){
        // clear the interval
        clearInterval(myInterval);
        // run your code
        $('.showTime .appr').each(function(index){
            $(this).delay(500*index).fadeIn(400);
        });
    }
}, 50);

所有这一切，这可能不是最好的设计模式 - 使用回调而不是轮询和消耗CPU会更好。

在setInterval函数内部使用时，Jquery延迟不一致

1 个答案: