通过字段名称在 Javascript 中连接 JSON答案

【问题标题】：Connect JSON in Javascript via field names通过字段名称在 Javascript 中连接 JSON
【发布时间】：2013-12-06 06:11:09
【问题描述】：

我正在尝试将 JSON 数据连接到我的 Javascript 中，JSON 看起来像这样：

{
  "status":"ok",
  "count":5,
  "pages":1,
  "category":{
    "id":85,
    "slug":"front-page-active",
    "title":"Front Page Active",
    "description":"",
    "parent":0,
    "post_count":5
    },
  "posts":[{
      "id":1535,
      "type":"post",
      "slug":"url",
      "url":"url/",
      "status":"publish",
      "title":"title",
      "title_plain":"title",
      "content":"content… …

我的 Javscript 看起来像这样：

'<p class="listTitle">' + item.title + '</p>'

我知道我正在正确连接文件，因为我已经让它与其他 JSON 文件一起使用。我在想这个文件的设置不同，我只是不知道我错过了什么。我是否必须修改 item.title 打电话？

这是完整的 javascript 文件：

$(document).ready(function(){
    var outputNews = $('#newsPageUl');
    var spinner = $('.pageLoaderSpinner');

    $.ajax({
        url: 'url',
        dataType: 'json',
        timeout: 20000,
        cache: false,
        success: function(data, status){
            $.each(data, function(i,item){ 
                var newsEvent = 

                //Generated HTML

                '<li><div class="newsFeedTopBg"></div><div class="newsFeedMidBg">'
                + '<p class="listTitle">' + item.title + '</p>'
                // + '<p class="date">' + item.posts[0].date + '</p>'
                // + '<p class="pContent">' + item.posts[0].content + '</p>'
                + '</div><div class="newsFeedBottomBg"></div></li>'

                //End Generated HTML

                ;

                spinner.empty();
                outputNews.append(newsEvent);
            });
        },
        error: function(){
            spinner.empty();
            navigator.notification.confirm(
                "Could not connect.",
                connectionErrorNews,
                'Connection Error',
                "Go Back, Try Again"
            );
        }
    });
});

【问题讨论】：

你能发布一个 jsfiddle 来重现这个问题吗？
什么是item.title？您的 JSON 中似乎没有这样的变量/树？
但是有item.category.title和item.posts[0].title...
我尝试了这两个，但没有任何结果。我知道我的语法不对。我不太了解这个...我想要帖子部分中的内容和标题。

标签： javascript jquery json

【解决方案1】：

在你的 JavaScript 文件中有一行：

$.each(data, function(i,item){

继续将其更改为：

$.each(data.posts, function(i,item){

这会将您的item 变量设置为每个帖子的帖子对象。并且帖子有标题，所以现在一切都应该正常了。

【讨论】：

【解决方案2】：

var data = {
    "status": "ok",
    "count": 5,
    "pages": 1,
    "category": {
        "id": 85,
        "slug": "front-page-active",
        "title": "Front Page Active",
        "description": "",
        "parent": 0,
        "post_count": 5
    },
    "posts": [{
        "id": 1535,
        "type": "post",
        "slug": "haverhill-public-schools-holiday-events-calendar",
        "url": "http:\/\/www.haverhill-ps.org\/haverhill-public-schools-holiday-events-calendar\/",
        "status": "publish",
        "title": "Haverhill Public Schools holiday events calendar"
    }, {
        "id": 1536,
        "type": "post",
        "slug": "haverhill-public-schools-holiday-events-calendar",
        "url": "http:\/\/www.haverhill-ps.org\/haverhill-public-schools-holiday-events-calendar\/",
        "status": "publish",
        "title": "Haverhill Public Schools holiday events calendar"
    }]};

for(key in data) {
  if(key == "category")
      alert(data["category"].title);
  if(key == "posts")
      data["posts"].forEach(function(e) {
          alert(e.title);
      });
}

http://jsfiddle.net/3T7tC/2/

【讨论】：