jQuery Ajax and HTML callback

Question

我有这段代码，在单击链接时执行：

$.get(file.html, function(data) {           
  $('selector_1').html($(data).find('selector_2').html());
});

我想以这样一种方式修改代码，即当我单击链接时，$.get命令在淡出时运行selector_1，当放置selector_1的 HTML 时，它会淡入。

如何做到这一点？

Answer 1

假设selector_1和selector_2只是一个示例，请尝试以下使用 fadeOut 回调的代码。

$('selector_1').fadeOut(300, function() {        
    $.get(file.html, function(data) {
        $('selector_1')
            .html($(data).find('selector_2').html())
            .fadeIn();
    });    
});

另请注意，$.get包装在fadeOut回调中，因此转换是完美的。

这也是我想到的解决方案，但问题是 $.get 命令是在淡出后发送的，而不是同时发送的 - 我希望 $.get 命令立即执行。

见下文。

$('selector_1').fadeOut(300);
$.get(file.html, function(data) {
    $('selector_1')
      .html($(data).find('selector_2').html())
      .fadeIn();
});