2

我正在使用 Songkick API 来列出下一个演出日期，我已经修改了此处找到的代码。这是JSON 数据源的副本。

的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]获取最新信息”。

4

2 回答 2

1

.使用(Dots)访问 json 树

events = data.resultsPage.results.event;
于 2012-04-27T22:12:08.150 回答
0 
  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-27T22:41:50.910 回答