CODEWITHSUNDEEP
javascriptjquery
Jeff B.
Jeff B.

Reputation: 1167

jQuery delay to work with append()

I can't make the delay function of jQuery works with append function. What is wrong? Is there a way to make it work? I want to avoid using setTimeout directly to make it more easy to follow for the customer, who will maintain it himself, without any experience.

My code:

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

In this code, I get 'testtest' printed at the same time, delay is ignored.

Upvotes: 8

Views: 18398

Answers (3)

Matt
Matt

Reputation: 75327

This is because delay(2000) queues the fx queue by default, which append() is never part of.

Instead, you can specifically queue append() on it using the queue() function.

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

You can see an example of this working here; http://jsfiddle.net/mj8qC/

However, I agree with @ascii-lime's comment; I expect the customer will have more chance understanding setTimeout as it's a fundamental part of JavaScript, unlike delay(), which confuses many users (from experience on questions asked on StackOverflow).

FWIW, this question triggered me to write a blog post on the uses of delay(); it goes into more detail than this answer, and might be great further reading for others.

Upvotes: 26

Denys Séguret
Denys Séguret

Reputation: 382294

delay() is a tricky function that can't be use with anything : it's mainly made for effects (it returns immediately, it doesn't block the javascript execution flow).

From the doc :

It can be used with the standard effects queue or with a custom queue

(so you have to use a custom queue if you're not using the fx queue)

Use setTimeout in this case.

Upvotes: 3

srini.venigalla
srini.venigalla

Reputation: 5145

Yes. The return from delay is immediate. Nothing in your code suggest that the reurn should wait. You need to use setTimeout for the engine to wait..

Upvotes: 1

Related Questions