Question

我在jQuery中有一个Ajax POST调用，它运行PHP脚本并接收一些数据。我希望能够在成功函数之外处理这些数据。

我已经实例化了一个全局变量components，但这似乎没有成功函数内的范围。

在阅读this之后，我试图在AJAX调用之外调用一个函数，将数据分配给全局变量components_passed。这也行不通。

如何将数据转换为全局变量？我可以调用一个函数来做我想做的事情，但我可能想再次访问数据。

// Function to try to receive data
var components_passed;
function pass_out(data) {
    components_passed = data;
}

var components = [];    // create empty array for component list
if ($('#area').val) {   // if area contains a value and isn't zero (i.e. an area has been selected)
$.post("/basic/get_area_components.php"
    ,{area: $("#area").val()}
    ,function(data){ components = JSON.parse(data);
        console.log(components);  // Show data in console - works
        pass_out(data);   // Call function to try and assign data to global variable
    });
}
console.log(components);  // Doesn't work - empty array

console.log(components_passed);  // Doesn't work - empty array

Answer 1

你遗漏了一个小概念：AJAX表示异步。

考虑以什么顺序发生的事情：

你声明变量，函数等等。

然后执行XHR请求，

然后记录变量components

然后记录components_passed

然后什么也没有。

在某一点之后，AJAX调用将返回，然后，只有这样，您的回调才会被执行，您返回的数据保存在components_passed内。

您可能想要做的是等待调用返回然后执行任何操作，例如日志记录。但是在调用console.log(components_passed)时，数据尚未加载;这就是你打印一个空变量的原因。

Answer 2

首先处理异步代码可能很棘手

您将从console.log语句中看到事情发生的顺序

function do_something(c) {
    // here, c is components
    // you can do things here with c
    console.log(4);
}

if ($('#area').val) {   // if area contains a value and isn't zero (i.e. an area has been selected)
    console.log(1);
    $.post("/basic/get_area_components.php", {area: $("#area").val()}, function(data){ 
        console.log(3); // this line is executed once $.post has retrieved the data
        var components = JSON.parse(data);

        // everything you need to do with components, you must do here, or in functions called from here

        do_something(components);

    });
    console.log(2); // as you can see, this line is executed before the callback
}

如何在返回函数之外使用Ajax POST调用中返回的数据？

2 个答案: