来自jquery函数的返回值不起作用

时间:2013-10-29 19:28:39

标签: jquery function return-value

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

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);
});

2 个答案:

答案 0 :(得分:1)

尝试:

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

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

答案 1 :(得分:0)

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

与上述评论者一样,AJAX代表异步Javascript和XML,这意味着您获取数据的请求独立于脚本中的其他内容运行。这是我们拥有事件的原因之一,因此您可以等到事情发生之后再尝试对其结果做一些事情。

在您的示例中,您已经使用以下方式收听 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();
});

希望这有帮助!