在 ajax 成功调用之外使用数据答案

【问题标题】：use data outside of ajax success call在 ajax 成功调用之外使用数据
【发布时间】：2021-01-01 13:03:46
【问题描述】：

我正在尝试从 AJAX 成功调用中获取数据，以便在代码的其他地方使用。但是，由于某种原因，最后一行中的 console.log 返回“未定义”。我也在数据上试过JSON.parse()和JSON.stringify()，都返回了错误。

function loadInfo() {
    jQuery(function($) {
        $.ajax({
            type: "POST",
            url: "/admin.php",
            data: {loadInfo: 1},
            dataType: "json",
            success: function(data) {
                getResponse(data);
            }
        })
    });
}

var data;
function getResponse(response) {
    data = response;
}

console.log(data);

但是，如果我在函数中执行了 console.log...

var data;
function getResponse(response) {
    data = response;
    console.log(data);
}

它按预期输出数据。我认为数据变量将是全局的。还是别的什么？

【问题讨论】：

var data; 使其未定义。在进行 AJAX 调用之前，它是未定义的。如果日志在函数之外，那么它会在 AJAX 之前运行。

标签： javascript jquery json ajax

【解决方案1】：

AJAX 代表异步 Javascript 和 XML。异步意味着它正在发出一个请求，但由于这可能需要一些时间才能到达、处理及其响应才能返回，所以它不是等待请求完成，而是继续执行操作。

当你这样做时

console.log(data);

在您的代码中，请求仍在执行中，并且由于它未完成，因此尚未执行回调。回调仅在请求成功完成时执行。

修复：

function loadInfo() {
    jQuery(function($) {
        $.ajax({
            type: "POST",
            url: "/admin.php",
            data: {loadInfo: 1},
            dataType: "json",
            success: function(data) {
                getResponse(data);
                console.log(data);
            }
        })
    });
}

var data;
function getResponse(response) {
    data = response;
}

//console.log(data);

这个想法是我们需要在请求完成后继续处理请求的结果。请注意，我的 console.log 不在 getResponse 内，因为最好将结果表示与结果计算分开。

【讨论】：