jQuery AddClass 然后删除一个类

Question

In my Rails application, I send an Ajax request when the user hits the Save button, when it sends the request, I can return some jQuery.

What I'd like to do is add a class (saving), have a delay and then remove the class.

So, I added this:

$('.button').addClass('saving').delay(2000).removeClass('saving');

For some reason, it isn't working. What am I doing wrong?

Answer 1

.delay() is actually for animations.

Use setTimeout()

$('.button').addClass('saving');

setTimeout(function () { 
    $('.button').removeClass('saving');
}, 2000);

Answer 2

delay only works with animation-related methods, you can use queue method:

$('.button').addClass('saving').delay(2000).queue(function( next ){
    $(this).removeClass('saving'); 
    next();
});

http://jsfiddle.net/Rp6Xw/44/

Answer 3

If someone needs more than one adding/removing of the class, .dequeue(); is also requered to function properly.

$('.button').addClass('saving').delay(2000).queue(function(){
   $(this).removeClass('saving'); 
   $(this).dequeue();
});

Answer 4

Try this maybe:

$('.button').addClass('saving').delay(2000, function() {
    $(this).removeClass('saving')
});

Answer 5

最短的路。

$(".button").addClass("saving").show(0).delay(2000).removeClass("saving");