迭代多个JSON而不是一个

时间:2014-06-24 04:15:50

标签: javascript jquery json

我有一些jQuery迭代一些JSON(特别是Google Calendar feed)并打印出日历中每个事件的列表项。代码如下所示:

// URL for some Google Calendar data
// (if this link should go down, any gcal feed URL should work just the same)
var gcalUrl = "http://mikeclaffey.com/sandbox/gcal-embed/example-json-data.js";

// Get list of upcoming events formatted in JSON
$.getJSON(gcalUrl, function(data){

    // Parse and render each event
    $.each(data.feed.entry, function(i, item){

        // Render the event
        $("#gcal-events li").last().after( "<li>" + item.title.$t + "</li>" );
    });
});

我正在尝试调整代码,以便它可以组合来自多个URL的JSON,但是我无法将JSON数据合并到一个对象中。我尝试迭代一系列JSON URL并将所有数据合并到一个对象中,但它似乎并没有创建一个可用的对象。这是我的代码:

var gcalUrls = ["http://mikeclaffey.com/sandbox/gcal-embed/example-json-data.js"];
var allData = {};

// Iterate through the array of Google Calendar feed URLs
$.each(gcalUrls, function(i, url) {

    // Download each feed
    $.getJSON(url, function(data){

        // Add this feed's data to allData
        $.extend(true, allData, data);
    });
});

// Parse and render each event
$.each(data.feed.entry, function(i, item){

    // Render the event
    $("#gcal-events li").last().after( "<li>" + item.title.$t + "</li>" );
});

此代码无法打印任何内容。我做错了什么?

1 个答案:

答案 0 :(得分:1)

由于ajax的异步特性,它不会起作用。

您可以使用$ .when()来解决它,如

var gcalUrls = ["http://mikeclaffey.com/sandbox/gcal-embed/example-json-data.js"];
var allData = {};

// Iterate through the array of Google Calendar feed URLs
var promises = $.map(gcalUrls, function (i, url) {

    // Download each feed
    return $.getJSON(url);
});

$.when.apply($, promises).then(function () {
    // Parse and render each event
    $.each(arguments, function (i, arg) {
        // Parse and render each event
        $.each(arg[0].feed.entry, function (i, item) {

            // Render the event
            $("#gcal-events li").last().after("<li>" + item.title.$t + "</li>");
        });
    });
})