Question

我正在构建的网站上有一个Smile timeline小部件。我已经按照几个关于如何实现和定制它的教程，到目前为止都很好。但是我找不到使用Json服务的方法，而不是使用存储在js文件中的全局变量中的数据。我在javascript上并不擅长，所以我找不到一种方法来存储全局变量中的整个Json输出（相应地格式化）。

这是全局变量中的数据应该如何显示：

var timeline_data = { 
'events' : [
        {'start': '2000',
        'title': 'Barfusserkirche',
        'description': 'by Lyonel Feininger, American/German Painter, 1871-1956',
        'image': 'http://images.allposters.com/images/AWI/NR096_b.jpg',
        'link': 'http://www.allposters.com/-sp/Barfusserkirche-1924-Posters_i1116895_.htm'
        },

        {'start': '2001',
        'end': '2004',
        'title': 'Three Figures',
        'description': 'by Kasimir Malevich, Ukrainian Painter, 1878-1935',
        'image': 'http://images.allposters.com/images/BRGPOD/75857_b.jpg',
        'link': 'http://www.allposters.com/-sp/Three-Figures-1913-28-Posters_i1349989_.htm'
        },

        {'start': '2002',            
        'end' : '2003',
        'title': 'Landschaft bei Montreuil',
        'description': 'by Albert Gleizes, French Painter, 1881-1953',
        'image': 'http://images.allposters.com/images/mer/1336_b.jpg',
        'link': 'http://www.allposters.com/-sp/Landschaft-bei-Montreuil-Posters_i339007_.htm',
        'isDuration' : true,
        'icon' : "red-ico.gif",        
        'color' : '#ffcc00',
        'textColor' : 'green'}
]}

这就是时间轴的调用方式：

var url = '.'; // The base url for image, icon and background image references in the data
eventSource1.loadJSON(timeline_data, url); // The data was stored into the timeline_data variable.

这就是我尝试过但我仍然坚持如何在变量中存储整个输出而不只是一个条目：

var timeline_data;//at global scope
$.ajax({ 
        type: 'GET', 
        url: '/timeline/json_output.json', 
        dataType: 'json', 
        timeout: 10000, 
        crossDomain: true, 
        success: function(result) {
            timeline_data = result;
        }
});

现在我不知道如何使用timeline_data。认为它是一个数组对象，不知道如何继续前进。

提前致谢

Answer 1

试试这个：

var timeline_data;//at global scope
$.ajax({ 
    type: 'GET', 
    url: '/timeline/json_output.json', 
    dataType: 'json', 
    timeout: 10000, 
    crossDomain: true, 
    success: function(result) {
        for(var i = 0; i < result.events.length; ++i){
            $.each(result.events[i], function(key, value) { 
                console.log(key + ': ' + value); 
            });
        }
    }
});

Answer 2

我实际上找到了here，并且像魅力一样工作！

function getJson(url) {
 return JSON.parse($.ajax({
     type: 'GET',
     url: url,
     dataType: 'json',
     global: false,
     async:false,
     success: function(data) {
         return data;
     }
 }).responseText);
}

var myJsonObj = getJson('myjsonurl');

是否有更有效的方式？

微笑时间线小部件Json feed

2 个答案: