jQuery循環通過JSON數組

Question

我有一個json數組，我通過ajax調用獲取，並希望循環它。 該數組輸出類別標題和該類別中的一些數據記錄。 陣列如下：

{"Travel":[{"title":"Beautiful title 1"},{"title":"Beautiful title 2"},{"title":"Beautiful title 3"}],"Other":[{"title":"Beautiful title 1"}]}

基本的每個功能都不能幫助我。

$.each(data, function(key, value) {
    console.log(value.title);
}

我希望能夠使用主類別標題輸出它，並在其下方顯示數據記錄。

所以例如我希望它看起來像這樣：

旅行（3結果）：

• 美麗的頭銜1
• 美麗的頭銜2
• 美麗的頭銜3
• 項目清單

其他（1結果）：

• 美麗的頭銜1

任何幫助將不勝感激。 謝謝。

Answer 1

 var data = {"Travel":[{"title":"Beautiful title 1"},{"title":"Beautiful title 2"},{"title":"Beautiful title 3"}],"Other":[{"title":"Beautiful title 1"}]}; $.each(data, function (key, value) { $('body').append($('<div></div>').html(key + ' (' + value.length + ' results)')); var list = $('<ul></ul>'); $('body').append(list); $.each(value, function (index, titleObj) { list.append('<li>' + titleObj.title + '</li>'); }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 

Answer 2

嘗試

$.each(data, function(key, value) {
  $("<ul />", {
    "class": key.toLowerCase(),
    "html": key + " (" + value.length + " results)<br />"
  }).append($.map(value, function(title, i) {
    return $("<li />", {
      "html": Object.keys(title)[0] + ":" + title.title
    })[0].outerHTML
  })).appendTo("body");
});

 var data = { "Travel": [{ "title": "Beautiful title 1" }, { "title": "Beautiful title 2" }, { "title": "Beautiful title 3" }], "Other": [{ "title": "Beautiful title 1" }] }; $.each(data, function(key, value) { $("<ul />", { "class": key.toLowerCase(), "html": key + " (" + value.length + " results)<br />" }).append($.map(value, function(title, i) { return $("<li />", { "html": Object.keys(title)[0] + ":" + title.title })[0].outerHTML })).appendTo("body"); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 

Answer 3

您需要嵌套的.each()因為數組包含嵌套對象。

$.each(data,function(i,object){
    console.log(i +'('+object.length+')')
    $.each(object, function (index, obj) {
        console.log(obj.title);
    });
});

小提琴

Answer 4

實際上你有一個Travel鍵

所以你可以這樣做：

$.each(data.Travel,function(key, value){
    console.log(value.title);
}