delay() 和 fadeOut() 不会在队列中延迟 attr()答案

【问题标题】：delay() and fadeOut() don't delay attr() in the queuedelay() 和 fadeOut() 不会在队列中延迟 attr()
【发布时间】：2011-02-17 22:12:36
【问题描述】：

这段代码有什么问题？我正在尝试获得这种效果：fadeOut(500) 和 attr('class','myClass') 延迟 600 毫秒.. 然后再次 delay(600) 和 fadeIn(500)。延迟发生正确，但attr() 没有被延迟，它在#myDiv 仍在消失时触发！ :'(

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

【问题讨论】：

标签： jquery delay attr

【解决方案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() 方法可以使这更简洁:)

【讨论】：

我认为你应该在函数内部调用$(this).dequeue()。来自文档：请注意，当使用 .queue() 添加函数时，我们应确保最终调用 .dequeue() 以便执行行中的下一个函数。 无论如何 +1 ;)跨度>
@Felix - 糟糕，我通常将其称为队列中的最后一项，很好 :)
嗨尼克，非常感谢您的回答。正如您所说，它可以正常工作，但是队列中的以下调用不再起作用.. :( 编辑现在才看到 Felix 评论.. 非常感谢你们俩
@luca - 确保你正在尝试最新的答案......这是 Felix 在 cmets 中指出的，它现在应该可以工作了 :)
感谢您发布这个问题，它帮助我解决了我的问题