【问题标题】:loop through a json object in ajax response [duplicate]循环通过ajax响应中的json对象[重复]
【发布时间】:2014-10-27 12:18:07
【问题描述】:

我是 json 新手,所以我从我的 ajax 调用中得到一个 json 响应

现在我被困在循环 json 对象中

这是我的 json

 {
    "0": {
        "image": "http://test.com/systems.jpg",
        "anchor_tag_link": "http://test.com/1",
        "title": "Oct-Dec-2013"
    },
    "1": {
        "image": "http://test.com/energy.jpg",
        "anchor_tag_link": "http://test.com/1",
        "title": "July-Sept-2013"
    },
    "pages": 2
}

谁能帮忙

【问题讨论】:

  • $array = json_decode("json string",true); ??然后循环数组
  • 是对象还是字符串?

标签: javascript php json


【解决方案1】:

您可以按如下方式使用 for-in 循环:

var obj = {
  "0": {
    "image": "http://test.com/systems.jpg",
    "anchor_tag_link": "http://test.com/1",
    "title": "Oct-Dec-2013"
},
"1": {
    "image": "http://test.com/energy.jpg",
    "anchor_tag_link": "http://test.com/1",
    "title": "July-Sept-2013"
},
"pages": 2
}

for(var prop in obj) {
    var item = obj[prop];
    console.log(item);
}

请注意,您将获得日志中的项目,因为除了数字属性之外,您还将获得 pages 属性。

【讨论】:

  • 您好,感谢您的回复,我收到一个错误 SyntaxError: JSON.parse: unexpected non-whitespace character after JSON data at line 1 column 540
  • 我的错误是我错过了服务器端代码上的分号。无论如何它工作正常..谢谢你:)
【解决方案2】:

将您的 JSON 响应保存在变量中

var variable = {
    "0" : {
        "image" : "http://test.com/systems.jpg",
        "anchor_tag_link" : "http://test.com/1",
        "title" : "Oct-Dec-2013"
    },
    "1" : {
        "image" : "http://test.com/energy.jpg",
        "anchor_tag_link" : "http://test.com/1",
        "title" : "July-Sept-2013"
    },
    "pages" : 2
};

然后使用 jquery 循环它

$.each(variable, function(index, value) {
    alert(value.image);
    alert(value.anchor_tag_link);
});

【讨论】:

    【解决方案3】:

    你可以这样做。

    var json = JSON.parse(data);// here data is your response
        for (var key in json) {
    
        alert(json[key].image);// other also in the same way.
        }
    

    【讨论】:

      【解决方案4】:

      示例 1:

       success: function(responseData) {
              for (var key in responseData) {
                  alert(responseData[key]);
              }
          }
      

      示例 2:

      <script>
          var data = '{"name": "mkyong","age": 30,"address": {"streetAddress": "88 8nd Street","city": "New York"},"phoneNumber": [{"type": "home","number": "111 111-1111"},{"type": "fax","number": "222 222-2222"}]}';
          var json = JSON.parse(data);
      
          alert(json["name"]); //mkyong
          alert(json.name); //mkyong
      
          alert(json.address.streetAddress); //88 8nd Street
          alert(json["address"].city); //New York
      
          alert(json.phoneNumber[0].number); //111 111-1111
          alert(json.phoneNumber[1].type); //fax
      
          alert(json.phoneNumber.number); //undefined
      </script>
      

      Sample Code

      【讨论】:

        【解决方案5】:

        请尝试以下代码。您只需将“yourJSONObject”替换为 JSON 数组即可。

            $.each( yourJSONObject, function( keyImg, valImg ) {
                    image = valImg[0];
                    anchor_tag_link = valImg[1];
                    title = valImg[2];
            });
        

        问候,

        【讨论】:

          【解决方案6】:

          你可以像循环javascript对象一样循环:

             for(var arg in object) {
               object.hasOwnProperty(arg) {
                 process(object[arg]); 
               }
             }
          

          【讨论】:

            【解决方案7】:
            JQuery:
            var JSON = {
            "0": {
                "image": "http://test.com/systems.jpg",
                "anchor_tag_link": "http://test.com/1",
                "title": "Oct-Dec-2013"
            },
            "1": {
                "image": "http://test.com/energy.jpg",
                "anchor_tag_link": "http://test.com/1",
                "title": "July-Sept-2013"
            },
            "pages": 2
            };
            
            if(JSON.pages >0)
            {
               for(var i=0; i<JSON.pages; i++)
               {
                $('table').append('<tr><td>'+JSON[i].title+'</td><td>'+JSON[i].image+'</td><td>'+JSON[i].anchor_tag_link+'</td></tr>');
               }
            }
            
            HTML:
            <table border="1"></table>
            

            【讨论】:

              猜你喜欢
              • 1970-01-01
              • 2014-02-26
              • 2021-10-30
              • 2016-07-04
              • 2020-02-16
              • 1970-01-01
              • 1970-01-01
              • 2020-03-31
              • 1970-01-01
              相关资源
              最近更新 更多