Question

这段代码有什么问题？我试图获得此效果：fadeOut(500)和attr('class','myClass')延迟600毫秒..再次delay(600)和fadeIn(500)。延迟正确发生，但attr()没有被延迟，当#myDiv仍然褪色时会触发！：'（

$('#myDiv').fadeOut(500)
           .delay(600)
           .attr('class','myClass')
           .delay(600)
           .fadeIn(500);

Answer 1

.delay()仅影响动画或fx队列（除非您明确指定其他队列）。请记住，链接和排队是两个截然不同的概念，链接继续使用相同的jquery集，但这完全不同于该集合中元素的任何事件队列。

要让.attr()调用受到影响，您必须使用.queue()将其作为回调添加到同一个队列，如下所示：

$('#myDiv').fadeOut(500)
           .delay(600)
           .queue(function(next) { $(this).attr('class','myClass'); next(); })
           .delay(600)
           .fadeIn(500);

另请注意，有.addClass()，.removeClass()和.toggleClass()方法可以使这一点更清洁：）

delay（）和fadeOut（）不会延迟队列中的attr（）

1 个答案: