Получить JSON Data - новичок здесь

Я использую API Songkick для отображения следующей даты концерта, я скорректировал найденный код here. Это копия JSON data source.Получить JSON Data - новичок здесь

HTML-:

<head> 
<script src="jquery.js" type="text/javascript"></script> 
<script src="jquery.livequery.js" type="text/javascript"></script> 
<script src="jquery.nano.js" type="text/javascript"></script> 
<script src="application.js" type="text/javascript"></script> 
</head> 
<body> 
<ul id="concerts">Loading Next Gig...</ul> 
</body>

application.js является:

$(document).ready(function() { 
    var template = "<li>Our next gig is <a href='{uri}'>{displayName}</a></li>"; 
    var apikey = 'MY_API_KEY'; 
    var container = $("ul#concerts"); 
    $.getJSON('http://api.songkick.com/api/3.0/artists/253846/calendar.json?apikey=' + apikey + '&jsoncallback=?', function(data) { 
    container.html(""); 
    events = data["resultsPage"]["results"]['event']; 
if (events==null) { 
     container.append($.nano()); 
} 
else { 
     container.append($.nano(template, events[0])); 
} 
    }); 
});

Я хотел бы, чтобы отобразить в первый перечисленному концерт,

event.location.city 
event.venue.displayName 
event.start.date (in dd MMM format).

Если нет событий перечислены , Я бы хотел, чтобы он сказал что-то вроде «На данный момент нет концертов, пожалуйста, [a href="example.com"] click here [/a] за вверх на сегодняшний день ».

источник

2012-04-27 redditor

демо:http://jsbin.com/ocoric

var events = data.resultsPage.results.event; 
    $.each(events, function (i, item) { 
     container.append($.nano(template, item)); 
    });

ПРИМЕЧАНИЕ:, поскольку вы используете $.nano, вы должны перебирать объект json, чтобы заменить короткий код внутри шаблона var.

, если вы хотите получить доступ к свойствам JSon сингулярно вы должны получить доступ к нему, как показано ниже:

var uri = events.uri; 
var displayName = events.displayName;

вы полный код будет выглядеть следующим образом:

$(document).ready(function() { 
    var template = "<li>Our next gig is <a href='{uri}'>{displayName}</a></li>"; 
    var apikey = 'MY_API_KEY'; 
    var container = $("ul#concerts"); 
    $.getJSON('http://api.songkick.com/api/3.0/artists/253846/calendar.json?apikey=' + apikey + '&jsoncallback=?', function (data) { 
     container.html(""); 
     var events = data.resultsPage.results.event; 
     if (events !== null) { 
     $.each(events, function (i, item) { 
      container.append($.nano(template, item)); 
     }); 
     } 
    }); 
});

источник

2012-04-27 22:41:50

Используя другие ответы и ваш пример, я изменил приложение application.js по строкам: var template = "

Наш следующий концерт: location: {location.city} , venue: {venue.displayName} on {start.date}

"; Спасибо всем! – redditor

Доступ к JSON дерево с . (Dots)

events = data.resultsPage.results.event;

источник

2012-04-27 22:12:08 Starx

Привет Starx, спасибо за возвращается ко мне так быстро. Я думаю, что теперь я понимаю метод получения данных - и я предполагаю, что могу просто создавать новые переменные: event = data.resultsPage.results.event.location.city и то же самое для двух других строк, за которыми я работаю, но как я бы добавил эти переменные, например container.append ($ .nano (шаблон, события [0], место проведения [0])); ? Благодарю. – redditor

Получить JSON Data - новичок здесь

ответ

Смежные вопросы