代码之家 › 专栏 › 技术社区 › Sphvn Frebin Francis

用getjson jquery解析复杂数组

getjson arrays json ajax jquery

Sphvn Frebin Francis · 技术社区 · 15 年前

TLDR:

开始于 this question 把它简化了,在这里继续工作。
我需要“获取”JSON数组
正确格式化它,对于数组中的每一个,将它放在相应的分区中。
??
它起作用了。

以下是这个问题简化并继续。

我需要一些来自数组的复杂JSON数据。有了它,我需要标题和它的价值。我这样做的原因是因为我知道数组被调用什么,但不知道数组内部生成的数据。

假设这个新数组看起来如下:

    {"Days":
[{"day": "Sunday", "time": "10.00"},
 {"day": "Monday", "time": "12.00"},
 {"day": "Tuesday", "time": "09.00"},
 {"day": "Wednesday", "time": "10.00"},
 {"day": "Thursday", "time": "02.00"},
 {"day": "Friday", "time": "05.00"},
 {"day": "Saturday", "time": "08.00"}
]}

修正感谢(马修·弗莱森)

我需要它来获得星期日和10点,以及所有其他人一样。

我现在要分析的代码如下:

$.getJSON(url,
    function(data){
      $.each(data, function(i,item){
      $('.testfield').append('<p>' + item + '</p>');
      });
    });

如果不增加每个日期的时间,它将按如下方式分析数据:

Sunday, Monday, Tuesday, Wednesday, Thursday, Friday, Saturday

随着时间的增加,Firebug不再将其识别为JSON字符串。所以我猜我把这里的格式弄错了。而且,我需要每天和每一天的时间去做一个我认为

$('.testfield').append('<p>' + item + '</p>' + '<br />');

将每个应用到一个新行,但这不起作用。

我如何让每一天或每一项都在新的行上?
如何让$getjson正确地将数据day及其值解析为一个div?

3 回复 | 直到 14 年前

Mottie 15 年前

尝试此操作(重新格式化的JSON-下次使用 JSONLint ):

{
    "Days": [
        {
            "Sunday": "10.00",
            "Monday": "12.00",
            "Tuesday": "09.00",
            "Wednesday": "10.00",
            "Thursday": "02.00",
            "Friday": "05.00",
            "Saturday": "08.00" 
        }
    ]
}

要使用的脚本:

 $.getJSON( url, function(data){
  $.each(data.Days[0], function(key,value){
   $('.testfield').append('<p>' + key + ' : ' + value + '</p>');
  });
 });

Matthew Flaschen 15 年前

这不是有效的JSON。做一些类似的事情:

{"Days":
[{"day": "Sunday", "time": "10.00"},
 {"day": "Monday", "time": "12.00"},
 {"day": "Tuesday", "time": "09.00"},
 {"day": "Wednesday", "time": "10.00"},
 {"day": "Thursday", "time": "02.00"},
 {"day": "Friday", "time": "05.00"},
 {"day": "Saturday", "time": "08.00"}
]}

总是使用 JSONLint 或者另一个验证器来检查您的语法。

tuomassalo 15 年前

有点离题,但如果您不确定内容,则应该使用安全的方法将数据插入到DOM中。否则,您的代码存在XSS漏洞。

除安全问题外,“foo bar<foo.bar@example.com>”等任何数据都不会按您(可能)想要的方式呈现。

例如,可以使用jquery text()方法:

$('.testfield').append($('<p></p>').text(item));