double使用jquery调用ajax

Question

两个电话：

$('#add').live('click', function() {

    $('.simplebox').slideUp(200, function() {
        $('html, body').animate({scrollTop:140}, 350, function() {
            $('#loading-add').slideDown(300, function() {
                $.ajax({
                    type: "POST",
                    url: "..",
                    data: getDataToPost(),
                    cache: false,
                    success: function(data){

                        alert(data);

                        $('#loading-add').delay(1000).fadeOut(200, function() {
                            $('#successfull-add').fadeIn(200);
                        });

                    }
                });
            });
        });
    });

})

但是如果我在live事件之后立即调用ajax，它会按时调用（应该是）：

$('#add').live('click', function() {
                $.ajax({
                    type: "POST",
                    url: "..",
                    data: getDataToPost(),
                    cache: false,
                    success: function(data){

                        alert(data);

                        $('#loading-add').delay(1000).fadeOut(200, function() {
                            $('#successfull-add').fadeIn(200);
                        });

                    }
                });
})

有什么想法为什么会发生？真奇怪..

谢谢。

Answer 1

尝试使用queue()：

$('.simplebox').slideUp(200);
$('.simplebox').queue(function() {
    $('body').animate({scrollTop:140}, 350);
    $('body').queue(function() {
        $('#loading-add').slideDown(300);
        $('#loading-add').queue(function() { 
            //ajax call
        });
    });
})