jquery - jQuery Ajax 和 HTML 回调

Question

我有这段代码，当点击链接时执行：

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

我想以这样的方式修改代码，当我点击一个链接时，$.get命令在selector_1淡出时运行，而当我的 HTMLselector_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();
});