0

我正在使用 ajax 函数返回一个值,因此我可以将它保存在一个变量中并在任何地方使用它,但它不起作用我收到一条消息:未定义

function getData(){
    var ajax = false;
    ajax = new XMLHttpRequest()
    ajax.open("GET","ajax.php");
    ajax.onreadystatechange = function(){
        if(ajax.readyState == 4 && ajax.status == 200){
            var test = ajax.responseText;
            return test ;
        }
    }
    ajax.send(null);
}

$(document).ready(function(e) {
    var n = getData();
    alert(n);
});
4

2 回答 2

1

尝试:

function getData() {
    return $.ajax({
        type: "GET",
        url: "ajax.php",
        async: false,
    }).responseText;
}

$(document).ready(function(e) {
    var n = getData();
    alert(n);
});
于 2013-10-29T19:50:34.220 回答
0

首先,在您的示例中,该函数getData()实际上并未返回任何内容。您正在发出 AJAX 请求,当 AJAX 请求成功时您说return data,但getData()函数本身不返回任何内容。您有一个函数在另一个函数(父函数)中返回一些东西(子函数)。父函数,即您实际调用的函数,没有任何返回值。这就是为什么当您尝试警告结果时总是看到“未定义”的原因getData()

就像上面的评论者所说,AJAX 代表异步 Javascript 和 XML,这意味着您获取数据的请求独立于脚本中的其他所有内容运行。这是我们有events的原因之一,因此您可以等到事情发生后再尝试对其结果进行操作。

在您的示例中,您已经通过以下方式监听onreadystatechange事件:

ajax.onreadystatechange = function(){
    if(ajax.readyState == 4 && ajax.status == 200){
        var test = ajax.responseText;
        return test ;
    }
}

您需要做的是等到请求完成后再尝试操作从 AJAX 请求返回的数据。如果您将变量存储在函数test之外getData,那么它将可用于整个脚本中的其他函数。当 AJAX 请求成功时,您可以存储返回的数据test并调用另一个处理test.

这里有一些代码向您展示我的意思:

// Keep "test" globally outside of the scope of getData
// This makes "test" available throughout the rest of the script
var test;


function getData(){

    var ajax = false;
    ajax = new XMLHttpRequest()
    ajax.open("GET","ajax.php");
    ajax.onreadystatechange = function(){
        if(ajax.readyState == 4 && ajax.status == 200){

            // This is where we know that the AJAX request has completed
            // so we know we have the data. Store the data in the "test"
            // variable, and call another function here that will do something
            // with "test" - this way "test" won't be undefined!
            test = ajax.responseText;
            doNextStep();
        }
    }

    ajax.send(null);
}

// This new function I've introduced won't get called until
// the Ajax request was successful.
function doNextStep() {
    alert( test );
}

$(document).ready(function(e) {
    getData();
});

希望这可以帮助!

于 2013-10-29T20:01:38.167 回答