javascript setTimeout or jquery delay - neither are working for me

javascript jquery delay settimeout

11,465

Solution 1

In case of setTimeout you're simply doing it wrong.

setTimeout(sale(), 3000); // will call sale and use the RETURN value in the callback but sale returns undefined

You need to pass in a function:

function sale() {
    $('#sale').slideDown(500);
}

setTimeout(sale, 3000); // just pass in the reference to sale()

Other possibility:

// no difference in this case
// Note: if it were obj.sale() then you would need to do this version
//       otherwise sale() will get called with the this set to window
setTimeout(function(){sale()}, 3000)

And last but not least:

setTimeout(function() { $('#sale').slideDown(500); }, 3000);

Solution 2

You need to be in a queue for delay() to work.

$('#sale').queue(function() {

   $(this).delay(3000).slideDown(500).dequeue();

});

See it.

Patrick Dw has informed in the comments you don't need to be in a queue() if your next method chain is an animation. See his JSFiddle.

11,465

Author by

Catfish

Old enough to party. Nerdy by nature. Codementor Blog

Updated on June 13, 2022

Comments

Catfish almost 2 years
I have a div like this
```
<div id="sale">
    ........
</div>
```
and I tried to use both
```
$('#sale').delay(3000).slideDown(500);
```
and
```
setTimeout(sale(), 3000);

function sale() {
    $('#sale').slideDown(500);
}
```
but neither of them are working. The jQuery delay says $('#sale').delay() is not a function while the setTimeout way says useless setTimeout call (missing quotes). If I add double quotes around the sale() call, it just says "Sale is not defined".

Why won't either of these work?

All I'm trying to do is make a div appear 3 seconds after the page is loaded.
AndreKR over 13 years

delay() can't be the first element of an animation chain?
AndreKR over 13 years

Argh, I wasn't sure... lost the 50/50 chance. ;)
Ivo Wetzel over 13 years

@Matthew I know, fixed it, just habit since I always end up with the need of a that when I use setTimeout ;)
Alex Weber over 13 years

alternatively you could just put the animation inside the anonymous function
user3167101 over 13 years

Bad idea - this internally evokes an eval() type function. Just pass sale as the argument.
user113716 over 13 years

@AndreKR - Yes it can. This answer is wrong. jsfiddle.net/patrick_dw/Uts7t
user3167101 over 13 years

@patrick dw I could of sworn I recently read you need to be in a queue() for delay() to work... Oh well. Is this a recent jQuery development?
user3167101 over 13 years

@Catish What does alert(typeof jQuery) say?
Catfish over 13 years

jquery is loaded. i just didn't post that part
user113716 over 13 years

@alex - Well you do, but animations are added to a queue automatically. If you were to call something like .css() after .delay(), it would need to be manually queued.
user3167101 over 13 years

@patrick dw Thanks for teaching me something. +1 to your comment (and answer, if you post one). Oh, and I wouldn't say this answer is wrong, just unnecessarily verbose. :)
AndreKR over 13 years

It's ok to omit that part but here it's possibly the problem. Does a simple $('#sale').slideDown(500); without delay work?
user113716 over 13 years

@alex - Well ok, I'll say it was wrong in its implication (as evidenced by the first comment), but yes, the code did work. :o)
user113716 over 13 years

Another possible issue with this is that it isn't uncommon to define functions within the .ready() handler. If that's the case, sale would be inaccessible to the setTimeout which attempts to evaluate the string in the global context.