Question

我的网页会通过JSON加载一些XMLHttpRequest个文件我想加载文件，解析JSON并将输出存储在一个全局可访问的变量中完成foo和bar后，我才想调用success()函数。到目前为止，我的脚本有两个我需要帮助的问题。

1：我无法将变量设置为loadJSON()的输出。我的猜测是我的回复陈述有点时髦？我已经尝试了一切......帮助？

2：如何设置success()和foo后，我该如何致电bar？

var foo;
var bar;

function initSession(){

    foo = loadJSON("foo.js");
    bar = loadJSON("bar.js");

}

我的猜测是问题在于我如何在loadJSON()函数中使用return：

function loadJSON(url){

    var xhr = new XMLHttpRequest();

    xhr.onreadystatechange = function(){
        if(xhr.readyState == 4 && xhr.status == 200){  
            return JSON.parse(xhr.responseText);  // doesn't work?
        }
    }

    xhr.open("GET", url, true);
    xhr.send();

    return xhr.onreadystatechange;
}



$(document).ready(function(){
    initSession();
});


function success(){ 
    $("body").append(foo[0]);  
    $("body").append(bar[0]);  
}

谢谢！

Answer 1

对于将来发现这一点的任何人......以下是基于已接受答案中讨论的最终解决方案。这可以很容易地允许扩展在调用成功函数之前动态设置文件数。

var foo;
var bar;
var count = 0;

function initSession(){

    loadJSON("foo.js", "foo");
    loadJSON("bar.js", "bar");   

}

function loadJSON(url, name){

    var xhr = new XMLHttpRequest();

    xhr.onreadystatechange = function(){

        if(xhr.readyState == 4 && xhr.status == 200){  
            count++;
            window[name] = JSON.parse(xhr.responseText);;

            if (count == 2){
                success();
            } 
        }
    }

    xhr.open("GET", url, true);
    xhr.send();
}



$(document).ready(function(){
    initSession();
});



function success(){ 
    $("body").append(foo[0].option + "<br>" + bar[0].fname + " " + bar[0].lname);  
}

Answer 2

您可以尝试这样的事情：

$(document).ready(function(){
    loadJSON("foo.js");
    loadJSON("bar.js");
});

修改您的success功能：

function success(data){ 
    $("body").append(data[0]);  
}

然后在success callback/onreadystatechange

中进行修改

if(xhr.readyState == 4 && xhr.status == 200){  
    success(JSON.parse(xhr.responseText));
}

从success功能调用success callback/onreadystatechange功能。您也可以将回调函数传递给loadJSON函数，并可以从callback调用onreadystatechange/success callback函数，例如：

function loadJSON(url, callback){

    // ...

    xhr.onreadystatechange = function(){
        if(xhr.readyState == 4 && xhr.status == 200){  
            callback(JSON.parse(xhr.responseText));
        }
    }

    // ...
}

然后你可以像这样传递回调函数：

loadJSON("foo.js", function(data){
    // do something with data
});

因此，您可以针对不同的ajax请求使用不同的回调函数。

如何将XMLHttpRequest的输出存储在全局变量中

2 个答案: