Jquery嵌套ajax调用记住内部ajax调用中的第一个HTML响应

Question

确定。我需要做这样的事情：

1）发出GET ajax请求并记住变量中的HTML响应。 2）在第一个ajax请求（在回调函数中）中，我需要发出第二个POST ajax请求，并将HTML响应附加到第一个请求的记忆HTML响应中。 3）用变量中的HTML替换div。

这就是我要做的事情：

    var firstHtml;

    $.ajax({
        url: 'page.php',
        success: function(data) {
            firstHtml = data;
            $.ajax({
                type: 'POST',
                url: 'page2.php',
                data: 'param1=a&param2=b',
                success: function(htmlResponse){
                    // the firstHtml var is NULL here... why?
                    var finalHtml = firstHtml + htmlResponse;
                    $('#div').html(finalHtml);              
                }
            });
        }


    });

但是从评论中可以看出它不起作用。变量firstHtml在第二个AJAX请求中突然变为NULL。

Answer 1

试试这个：

$.ajax({
    url: 'page.php',
    success: function(result1) {
        $.ajax({
            type: 'POST',
            url: 'page2.php',
            context: { firstResult: result1 }, 
            data: { param1: 'a', param2: 'b' },
            success: function(secondResult) {
                var finalHtml = this.firstResult + secondResult;
                $('#div').html(finalHtml);
            }
        });
    }
});