javascript - ajax post 成功后淡入

Question

可能是一个简单的问题，但我一直试图让它工作几个小时。我几乎尝试了我在 stackoverflow 上找到的所有内容，但似乎没有任何效果。也许一双新鲜的眼睛可以告诉我如何做到这一点。

我想在调用这个javascript函数后淡入一个div。

            function getRequest(){
            $.ajax({
                type : "POST",
                url : "/includes/requests.php",
                data : "mode=get_requests",
                success : function(result)  { $("#requests").html(result);
                    $('#requests').fadeIn(9000);
                }
            });

        }

编辑：谢谢大家。这个

$('#requests').hide().fadeIn(9000);

做到了。

Answer 1

$('#requests').hide().fadeIn(9000);

您需要先隐藏元素，然后才能显示它。因此.hide()然后.fadeIn()。

Answer 2

$('#requests').hide();
function getRequest(){
    $.ajax({
        type : "POST",
        url : "/includes/requests.php",
        data : "mode=get_requests",
        success : function(result)  {
            $("#requests").html(result);
        }
    }).fail(function() {
        $('#requests').html('The AJAX failed!!');
    }).always(function() {
        $('#requests').fadeIn(9000);
    });
}

您可以通过将方法放入回调中来获得功能，因为您将知道 AJAX 是否成功。.fadeIn().always()

Answer 3

您需要在淡入之前隐藏元素，因为它已经对用户可见，如下所示：

$('#requests').hide().fadeIn(9000);