CODEWITHSUNDEEP
jquery
Florian Müller
Florian Müller

Reputation: 7785

jQuery wait for event to complete

How can I realize that when I have a function

$('.anyclass').slideToggle(1000);

that the program exetutes the function test() after the slideToggle completed?

If I write like this:

$('.anyclass').slideToggle(1000);
test();

...test() gets executed before slideToggle completed.

How can I realize? I don't know jQuery very well ...

Thank you for your help! Regards, Florian

EDIT: Results u can see here: www.virtual-swiss-hornets.ch

Upvotes: 9

Views: 26517

Answers (5)

Teuzer
Teuzer

Reputation: 1

The best way should be this

$('#result').append($("<div class='message'>Result Sucess</div>")).slideToggle(5000,function(){$(this).remove()});

Upvotes: 0

Lucas B
Lucas B

Reputation: 12013

If you only need this to fire once, Checkout the jquery API for when done

$.when(('.anyclass').slideToggle(1000)).done(function() { test(); });

Upvotes: 2

zindel
zindel

Reputation: 1865

I think slideToggle should accept the second argument callback, like this:

$('.anyclass').slideToggle(1000, function() {/* do anything after animation is complete */});

Actually for your particular case it is as easy as:

$('.anyclass').slideToggle(1000, test);

Upvotes: 4

James Kyburz
James Kyburz

Reputation: 14453

What you need is to use the callback function

http://api.jquery.com/slideToggle/

.slideToggle( [ duration ], [ callback ] )

   ('.anyclass').slideToggle(1000, function() { test(); });

Upvotes: 1

The_Butcher
The_Butcher

Reputation: 2488

You can add a callback function to your jQuery function.

$('.anyclass').slideToggle(1000,function() { test(); });

That function will ONLY fire once the slide is complete.

Upvotes: 17

Related Questions