JSON 到 HTML：为什么 JSON 的值未定义？
我是一个 JSON 菜鸟，试图摆弄此处讨论的世界杯统计数据的开放表 (http://yhoo.it/ydnworldcup2010)。
下面的内容（来自我发现的演示，仅使用 getJSON 的 YQL 调用和 div 的重命名）返回“undefined”的列表。我怎样才能让它返回实际数据？
<html>
<head>
<title>World Cup JSON attempt</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.js"></script>
<script type="text/javascript">
$("document").ready(function () {
$.getJSON('http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20csv%20where%20url%3D%22http://spreadsheets.google.com/pub%3Fkey%3D0AhphLklK1Ve4dEdrWC1YcjVKN0ZRbTlHQUhaWXBKdGc%26single%3Dtrue%26gid%3D1%26x%3D1%26output%3Dcsv%22%20and%20columns%3D%22surname,team,position,time,shots,passes,tackles,saves%22&format=json&diagnostics=true&callback=?', function (data) {
$("#content").html('');
$.each(data, function (i, item) {
$("#content").append('<div class="results"><div class="surname">' + item.surname + '</div><div class="team">' + item.team + '</div><div class="position">' + item.position + '</div><div class="time">' + item.time + '</div><div class="shots">' + item.shots + '</div><div class="passes">' + item.passes + '</div><div class="tackles">' + item.tackles + '</div><div class="saves">' + item.saves + '</div><div class="clear"></div></div>');
});
});
$("#content").fadeIn(2000);
});
</script>
</head>
<body>
<div class="main">
<h4>Results:</h4>
<div id="content"><img src="images/ajax-loader.gif" alt="Loading..." /></div>
</div>
</body>
</html>
I'm a JSON noob and trying to fiddle around with the open table of World Cup stats talked about here (http://yhoo.it/ydnworldcup2010).
The below (from a demo I found, just with the YQL call for getJSON and the div's renamed) returns a list of "undefined" 's. How can I get it to return the actual data?
<html>
<head>
<title>World Cup JSON attempt</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.js"></script>
<script type="text/javascript">
$("document").ready(function () {
$.getJSON('http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20csv%20where%20url%3D%22http://spreadsheets.google.com/pub%3Fkey%3D0AhphLklK1Ve4dEdrWC1YcjVKN0ZRbTlHQUhaWXBKdGc%26single%3Dtrue%26gid%3D1%26x%3D1%26output%3Dcsv%22%20and%20columns%3D%22surname,team,position,time,shots,passes,tackles,saves%22&format=json&diagnostics=true&callback=?', function (data) {
$("#content").html('');
$.each(data, function (i, item) {
$("#content").append('<div class="results"><div class="surname">' + item.surname + '</div><div class="team">' + item.team + '</div><div class="position">' + item.position + '</div><div class="time">' + item.time + '</div><div class="shots">' + item.shots + '</div><div class="passes">' + item.passes + '</div><div class="tackles">' + item.tackles + '</div><div class="saves">' + item.saves + '</div><div class="clear"></div></div>');
});
});
$("#content").fadeIn(2000);
});
</script>
</head>
<body>
<div class="main">
<h4>Results:</h4>
<div id="content"><img src="images/ajax-loader.gif" alt="Loading..." /></div>
</div>
</body>
</html>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
执行此操作：
示例： http://jsfiddle.net/WWHWw/
数据您正在寻找的内容嵌套在响应中更深的地方。
要观察返回的数据，您只需将其记录到浏览器的控制台，然后展开对象以查看其属性：
Do this:
Example: http://jsfiddle.net/WWHWw/
The data you're looking for was nested much deeper in the response.
To observe the data returned, you can simply log it to the browser's console, and expand the object to see its properties:
您需要做的第一件事是尝试理解 JSON 响应的布局。响应是一个“分层”json 回复，这意味着您已经尝试解析嵌套的数据。我已经调整了您的脚本，这是 jsfiddle 上的运行示例。
注意：如果您在 getJSON 函数中使用
console.log(data)，您将能够在 chrome 检查器或 firebug 中看到返回的对象是什么样子，然后您可以正确解析响应。The first thing you need to do is try and understand the layout of the JSON response. The response is a "layered" json reply, meaning you have nested data you're attempting to parse through. I've adjusted your script, and here's a running example on jsfiddle.
Note: of you use
console.log(data)inside your getJSON function, you'll be able to see in chrome inspector or firebug what the returned object looks like, then you can properly parse the response.