Question

我有不同的课程，每个课程都有不同的背景。我试图每隔2秒在div #elm上切换背景。为什么以下内容不会在每个索引之间延迟2秒。他们都马上进来了。

var classes = ['class1', 'class2', 'class3'];
$.each(classes, function(index, val) {
    $('#elm').removeAttr('class').addClass(val).delay(2000*index);
});

http://jsfiddle.net/bLHqP/

Answer 1

delay()仅适用于效果。

来自jQuery delay()文档

.delay（）方法最适合在排队的jQuery之间延迟效果。因为它是有限的 - 它例如，没有提供一种方法取消延迟-.delay（）不是替换JavaScript的原生 setTimeout函数，可能更多适用于某些用例。

由于addClass()不是效果，因此可以包含fadeIn（）效果并使用addclass作为回调函数。

var classes = ['class1', 'class2', 'class3'];
$.each(classes, function(index, ui) {
    $('body').removeAttr('class').delay(1000).fadeIn(function() {
        $(this).addClass(ui);
    });
});

检查http://jsfiddle.net/8e3Rm/

处的工作示例

Answer 2

编辑：

这有效：

for (var i = 0; i < classes.length; i++) {
    setTimeout (    
        (function(index){
        return function(){
            $('#elm').removeAttr('class').addClass(classes[index]);
        };
        })(i), 2000*i);
}

Answer 3

延迟方法不仅适用于使用效果队列的事件，例如淡入和淡出等等吗？

jQuery使用延迟（）与$ .each（）无法正常工作

3 个答案:

检查http://jsfiddle.net/8e3Rm/

编辑：