使用$ .each对Json数据进行jquery循环


160

我在名为data的变量中返回了以下JSON。

这是GETS返回的JSON ...

[ 
{"Id": 10004, "PageName": "club"}, 
{"Id": 10040, "PageName": "qaz"}, 
{"Id": 10059, "PageName": "jjjjjjj"}
]

我试图使用$ .each遍历整个集合,但是我遇到了警告显示未定义的问题。我尝试了很多不同的语法,但似乎无法弄清楚。

我正在使用的jQuery是

$.each(data, function(i, item) {
    alert(item.PageName);
});

谁能指出我正确的方向?

编辑 这是我用来获取数据的代码

$.getJSON('/Cms/GetPages/123', null, function(data) {
  fillSelect(data);
});

这是在回调时被调用的函数

function fillSelect(data) {
  alert(data);
  $.each(data, function(i, item) {
    alert(item.PageName);
  });
}

编辑2 这有点让我感到困惑,根据文档,它应该可以按我的方式工作,但事实并非如此。据提琴手说,标题显示:-

Content-Type: application/json; charset=utf-8

上面的JSON完全正确。如果这有任何不同,我正在使用chrome。将在IE和FF中测试。

编辑3

使用$ .get产生

"[\r\n {\r\n \"Id\": 10041,\r\n \"PageName\": \"01234567890\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 2\r\n },\r\n {\r\n \"Id\": 10001,\r\n \"PageName\": \"about\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 1\r\n },\r\n {\r\n \"Id\": 10056,\r\n \"PageName\": \"fdgdfgdfg\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 1\r\n },\r\n {\r\n \"Id\": 10052,\r\n \"PageName\": \"hjkhjk\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 2\r\n },\r\n {\r\n \"Id\": 10059,\r\n \"PageName\": \"jjjjjjj\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 1\r\n },\r\n {\r\n \"Id\": 10057,\r\n \"PageName\": \"qqqqq\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 2\r\n },\r\n {\r\n \"Id\": 10054,\r\n \"PageName\": \"qwqw\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 2\r\n }\r\n]"

这个对我有用。确保将数据正确传递给每个方法。
kgiannakakis

Answers:


303
var data = [ 
 {"Id": 10004, "PageName": "club"}, 
 {"Id": 10040, "PageName": "qaz"}, 
 {"Id": 10059, "PageName": "jjjjjjj"}
];

$.each(data, function(i, item) {
    alert(data[i].PageName);
});

$.each(data, function(i, item) {
    alert(item.PageName);
});

除非您有类似以下内容,否则这两个选项都可以正常工作:

var data.result = [ 
 {"Id": 10004, "PageName": "club"}, 
 {"Id": 10040, "PageName": "qaz"}, 
 {"Id": 10059, "PageName": "jjjjjjj"}
];

$.each(data.result, function(i, item) {
    alert(data.result[i].PageName);
});

编辑:

尝试一下并描述结果

$.get('/Cms/GetPages/123', function(data) {
  alert(data);
});

编辑3:

这可以解决问题,但不能解决使用“ eval”的想法,您应该在“ / Cms / GetPages / 123”中看到响应如何。

$.get('/Cms/GetPages/123', function(data) {
  $.each(eval(data.replace(/[\r\n]/, "")), function(i, item) {
   alert(item.PageName);
  });
});

1
看起来我需要添加eval(data)
Rippo 2010年

在jQuery中的“ httpData”函数中,您可以看到json数据的被称为window [“ eval”]。您不需要使用eval。这条线“ $得到(‘/ CMS / GETPAGES / 123’”是向您展示在“数据”接收。
安德烈斯descalzo


更新了答案(请参阅编辑3)以显示$.get产生的结果
Rippo 2010年

您如何返回“ / Cms / GetPages / 123”中的数据?
andres descalzo

17

您是否已将数据从字符串转换为JavaScript对象?

您可以使用data = eval('(' + string_data + ')'); or进行操作,这比较安全,data = JSON.parse(string_data);但是以后只能在FF 3.5或包含json2.js的情况下使用

自1.4.1起的jQuery也具有该功能$.parseJSON()

但是实际上,$.getJSON()应该给您已经解析过的json对象,因此您应该彻底检查所有内容,几乎没有错误埋在某处,就像您可能忘记了在json中引用某些内容,或者缺少其中一个括号一样。


看起来我需要添加fillselect(eval(data));
Rippo

BTW如何兼容eval
Rippo 2010年

3
那应该是data = eval('('+string_data+')');。此外,jQuery还有另一个功能data = jQuery.parseJSON(string_data);
Greg

有些事情不太正确。仅eval(data)适用。请参阅我的编辑2
Rippo

2
我已经看到jQuery.parseJSON(string_data)在某些情况下失败,其中data = eval('(''+ string_data +')')很好。
多米尼克·拉斯

5

只要使用正确的内容类型,getJSON就会为您将数据评估为JSON。确保服务器将数据作为application / json返回。


1
根据提琴手,内容类型是Content-Type: application/json; charset=utf-8
Rippo

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.