How to perfom action only after animate is finished?

I have my code:

$(this).attr("disabled","disabled");
$(this).animate({'opacity':'0.6'}, 200);
$(this).animate({'opacity':'1'}, 200);
$(this).attr("disabled","");

I want that the input would be disabled when the keypress'ed an开发者_JAVA技巧d it would be enabled only then, when the animation would be executed.

How can I do that?

Edit: I just realized I could do like that: $(this).delay(200).attr("disabled","");. Is it good practice?

Use a callback:

$(this).animate({'opacity':'0.6'}, 200, function() {
    // Animation complete.
  });

Not good practice to delay events, it is better to use an animation callback function. For example:

$(this).animate({'opacity':'1'}, 200, function(){
  $(this).attr("disabled","");
});

Try something like this:

$(this).animate({ 'opacity': '1' }, 200, function () {   
    $(this).attr('disabled', '');   
});