jquery ajax成功淡入淡出效果

我想要做一些效果，例如fadeIn页面，一旦我得到ajax响应。我想这一点，jquery ajax成功淡入淡出效果

$.ajax({ 
     type: "post", 
     url: actionLink, 
     cache: false, 
     data: ....someData...., 
     success: function(data) { 
      $(".response").fadeOut(100); 
      $(".response").html(data); 
      $(".response").fadeIn(500); 
     } 
    });

这是工作，但数据显示第一和用500ms的淡入效果获取数据的闪光灯，但我需要直接与淡入淡出效果得到加载的数据。

我甚至尝试过Fade out a div with content A, and Fade In the same div with content B，但我仍然遇到同样的问题。

我也试过：

$(".response").fadeOut(100).hide(); 
$(".response").show().html(data).fadeIn(500);

还是一样。我该如何解决？

来源

2011-06-30 Max

这件事的工作.........

jQuery(".response").fadeOut(100 , function() { 
    jQuery(this).html(data); 
}).fadeIn(1000);

来源

2011-06-30 10:38:02 Max

你试过：

$(".response").fadeOut(100).html(data).fadeIn(500)

来源

2011-06-30 10:28:19

嗨，谢谢你的回复。试过了。还是一样。第一个数据显示并开始fadeIn – Max

尝试$(".response").fadeOut(100).delay(100).html(data).fadeIn(500)

这将迫使后续操作（添加HTML到你的div）等到fadeOut完成后。

来源

2011-06-30 10:40:43 jsonnull

嘿，下面我发布了答案。我知道了。谢谢回复。它尝试了你的建议。还是一样。 – Max

你应该检查你的答案是对问题的正确答案，以便当人们来这里发表答案时，他们会发现答案已经得到解答。 – jsonnull

我只能在2天后检查我自己的答案。这是我检查时得到的警报。 – Max

success:function(data) 
{ 
    $(".response").fadeOut(600, function() 
     { 
      $(".response").html(data) 
     }); 
    $(".response").fadeIn(600); 
}

来源

2013-01-24 12:18:35 user2007412

我找到的最简单的方法是将初始fadeOut（）设置为'0'。这完美地工作：

$(".response").fadeOut(0).html(result).fadeIn(500);

与实际值设定初始淡出（）使得它“流行”中，然后将其在变淡仍然不是理想的结果。

因此，通过将初始fadeOut设置为0，表示在淡入之前它不会花费十分之一秒的淡出时间。所以您不会得到奇怪的效果。

来源

2014-11-20 10:42:15 c0d3n4m3

jquery ajax成功淡入淡出效果

回答

相关问题