Question

我有两个本地JSON文件，我试图在main.js文件中的函数中访问。只需一个JSON文件，一切正常，但我不确定如何合并第二个。理想情况下，像data_set1=$.getJSON("file1.json")这样的东西可以完美地运作，但是我看到类似的问题一再被问到，并且由于异步调用，这不一定是可能的（我不完全理解那些问题的所有答案）问题）。

这样可行：

$.getJSON("data.json", function(json){

    var data_points = [];
    for (i = 0; i < json.length; i++){
        data_points.push([json[i].name, json[i].age]);
    }

    $(function () {
       //do stuff with data_points

但我不知道如何合并第二个JSON调用以在最后使用该函数制作另一个列表。

Answer 1

您可以使用jQuery延迟加载。

var xFile, yFile;

var requestX = $.getJSON("data1.json", function(json){
    xFile = json;
});

var requestY = $.getJSON("data2.json", function(json){
    yFile = json;
});

$.when(requestX, requestY).then(function(){
   // do something;
   // this function only gets called when both requestX & requestY complete.
});

查看JQuery WHEN

Answer 2

ajax请求是ONE资源的一个请求。您无法使用相同的请求获取两个不同的资源。您需要两个请求：

var completed = 0;

$.getJSON('file1.json', function(json) {
    completed++;
    if (completed == 2) { all_done(); }
}
$.getJSON('file2.json', function(json) {
    completed++;
    if (completed == 2) { all_done(); }
}

function all_done(...) { ... }

或者简单地将两个json文件合并到服务器上的单个文件中：

{"file1":{data from file one here}, "file2":{data from file two here}}

并在代码中以data.file1和data.file2的形式访问它们。

Answer 3

您可以设置一个var来指示文件已加载，并在检查状态时调用相同的函数。这可能是个坏主意，具体取决于JSON中的数据量。

var xFileLoaded = false, yFileLoaded = false;
var xFile, yFile;

$.getJSON("data.json", function(json){
    xFile = json;
    xFileLoaded = true;
    doSomething();
});

$.getJSON("data.json", function(json){
    yFile = json;
    yFileLoaded = true;
    doSomething();
});

function doSomething() {
    if(xFileLoaded && yFileLoaded) {
        // good to go
    }
}

Answer 4

使用与@ MarcB的解决方案非常类似的东西，我会将文件保存在一个数组中并稍微概括一下：

var files = ["file1.json", "file2.json"];
var results = {};
var completed = 0;

function afterEach(fileName, json) {
    results[fileName] = json;
    if (++completed >= files.length) {
        afterAll();
    }
}

files.forEach(function (file) {
    $.getJSON(file, afterEach.bind(this, file));
});

这应该并行请求所有文件，允许浏览器选择实际打开和下载的连接数。每次完成后，结果（json）将放在哈希值中，以便在文件名下存储。完成所有文件后（假设files没有更改），将调用afterAll函数。

Answer 5

它以jquery的优雅方式存在：

$.when(
    $.ajax({
        url: 'file1.json/',
        success: function(data) {
            // Treatement
        }
    }),
    $.ajax({
        url: 'file2.json',
        success: function(data) {
            // Treatement
        }
    })
).then( function(){
    // Two calls are completed
});

完成两个调用后，您可以在块中进行任何操作＆＃34;然后＆＃34;。

在一个函数中使用来自两个单独的JSON文件的数据

5 个答案: