jQuery 延迟使用 append()答案

【问题标题】：jQuery delay to work with append()jQuery 延迟使用 append()
【发布时间】：2012-06-19 01:41:42
【问题描述】：

我无法使 jQuery 的延迟函数与 append 函数一起使用。怎么了？有没有办法让它工作？我想避免直接使用setTimeout，以方便客户自行维护，无需任何经验。

我的代码：

$('#chatwindow').append('test').delay(2000).append('test');

在这段代码中，我同时打印了“testtest”，delay 被忽略了。

【问题讨论】：

【解决方案1】：

这是因为delay(2000) 默认将fx 排队，而append() 绝不是其中的一部分。

相反，您可以使用queue() 函数专门将append() 排队。

$('#chatwindow').append('test').delay(2000).queue(function (next) {
    $(this).append('test');
    next();
});

您可以在此处查看此工作的示例； http://jsfiddle.net/mj8qC/

不过，我同意@ascii-lime 的评论；我希望客户有更多机会理解 setTimeout，因为它是 JavaScript 的基础部分，不像 delay()，它会让许多用户感到困惑（根据 StackOverflow 上提出的问题的经验）。

^{FWIW，这个问题促使我写了a blog post delay() 的用途；它比这个答案更详细，可能对其他人来说是很好的进一步阅读。}

【讨论】：

虽然这里有几个答案，但展示如何使用queues in jquery 是一个巨大的信息。绝对是最好的答案。
+1 append 默认不排队，立即执行，因为它不用于动画。这会将其添加到队列中。对于 OP 的客户，这是否比 setTimeout 更容易理解是值得商榷的，但这个答案绝对是最有用的。
你也可以引用上面的 jQuery 文档 :) ".delay() 方法最适合延迟队列中的 jQuery 效果。因为它是有限的——例如，它不提供取消延迟的方法——.delay() 不能替代 JavaScript 的原生 setTimeout 函数，这可能更适合某些用例。”
我是对这个delay函数非常警惕的人之一。它起初看起来像一个通用的魔术函数，然后您阅读 jquery 源代码以了解并发现它的用途非常有限。他们可能应该清楚地调用它以表明它主要是为了延迟效果。

【解决方案2】：

delay() 是一个棘手的函数，不能与任何东西一起使用：它主要用于效果（它立即返回，它不会阻塞 javascript 执行流程）。

来自the doc：

它可以与标准效果队列或自定义队列一起使用

（因此，如果您不使用 fx 队列，则必须使用自定义队列）

在这种情况下使用 setTimeout。

【讨论】：

【解决方案3】：

是的。从延迟中恢复是立竿见影的。您的代码中没有任何内容表明应该等待。您需要使用 setTimeout 让引擎等待..

【讨论】：