jquery fadeIn / out el然后fadeIn / out new el

Question

对不起，标题随时可以编辑，

无论如何这是我到目前为止的代码

$('#foo').click(function() {

  $('#foo2').html('<h4>Please wait...</h4>').fadeOut('fast');

  var sful = $('#foo3').fadeIn('fast').html('<h4>Success!</h4>').fadeOut('slow');
  setTimeout(sful, 4000);

});

我试图让＃foo2 点击fadeIn，然后点击fadeOut和＃foo3 （var sful）然后fadeIn / out。< / p>

Answer 1

$('#foo2').html('<h4>Please wait...</h4>').fadeOut('fast', function() {
  var sful = $('#foo3').fadeIn('fast').html('<h4>Success!</h4>').fadeOut('slow');
  setTimeout(sful, 4000);
});

回调（function() { ..将在动画播完后运行。请参阅http://api.jquery.com/fadeOut/（特别是[,callback]部分）。

Answer 2

$('#foo2')
          .html('<h4>Please wait...</h4>')
          .fadeOut('fast', function() {  // callback start after fadeOut()
                             setTimeout(function() {
                                 $('#foo3')
                                       .fadeIn('fast')
                                       .html('<h4>Success!</h4>')
                                        .fadeOut('slow');
                              }, 4000);
                           });