如何在fadeIn之前获取jQuery html（）加载完成？

Question

我使用这个脚本加载某些DIV的内容，另一个DIV中：

$(function() { 
     $('#menu a').click(function(e) { 
      e.preventDefault(); 
      var h = $(this).attr('href'); 
      $('#aqui').hmtl($(h).html()).fadeOut('slow').fadeIn('slow'); 
      //alert(h); 
     }); 
    }); 

但是，正如你可以在这里看到：http://jsfiddle.net/8rB3S/，内容是之前​​效果负荷。

我尝试这个技巧：https://stackoverflow.com/a/2745494/588842，但.html()，这不行....这只是fadeOut和不fadeIn

类似的东西：$('#aqui').fadeOut('slow').hmtl($(h).html, function(){$(this).fadeIn('slow');})

Answer 1

html()是同步的，它传递一个回调函数不会做任何事情。

fadeOut()另一方面是异步的。所以，首先调用它，并提供修改标记的回调函数，然后淡出元素回：

$("#aqui").fadeOut("slow", function() { 
    $(this).html($(h).html()).fadeIn("slow"); 
}); 

Answer 2

我不知道什么是理想的效果，但尝试下面的代码，

DEMO：http://jsfiddle.net/skram/8rB3S/2/

$(function() { 
    $('#menu a').click(function(e) { 
     e.preventDefault(); 
     var h = $(this).attr('href'); 
     $('#here').fadeOut(100, function() { 
      $(this).html($(h).html())   
      .fadeIn('slow'); 
     }); 
    }); 
}); 

或

DEMO：http://jsfiddle.net/skram/8rB3S/1/（使用#here因为这似乎是在那里你想让它）

$(function() { 
    $('#menu a').click(function(e) { 
     e.preventDefault(); 
     var h = $(this).attr('href'); 
     $('#aqui') 
      .hide() 
      .html($(h).html())   
      .fadeIn('slow');   
    }); 
}); 

Answer 3

使用淡出淡入功能回调：

$(function() { 
     $('#menu a').click(function(e) { 
      e.preventDefault(); 
      var h = $(this).attr('href'); 
      $('#aqui').fadeOut('slow', function(){ 
       $(this).html($(h).html()); 
       $(this).fadeIn('slow'); 
      }): 
     }); 
});