jquery：回圈遍歷json陣列

我有一個這樣的ajax呼叫：

  $.ajax({
    type: 'POST',
    url: 'assets/ajax/get-results.php',
    dataType: 'json',
    cache: false,
    data: {}, 
    success: function (data) {
      console.log(data);
      
      for(var i = 0; i < data.length; i  ) {
          var obj = data[i];

          console.log(obj);
      }          
    }
  });

console.log(data) 給了我：

(2) [{…}, {…}]
 0: {sum: 10, month: 'november', year: '2021', type: 'bezoeken'}
 1: {sum: 50, month: 'oktober', year: '2021', type: 'bezoeken'}
 length: 2
[[Prototype]]: Array(0)

console.log(obj) 將陣列分成兩部分：

{sum: 10, month: 'november', year: '2021', type: 'bezoeken'}
 month: "november"
 sum: 10
 type: "bezoeken"
 year: "2021"
[[Prototype]]: Object


{sum: 50, month: 'oktober', year: '2021', type: 'bezoeken'}
 month: "oktober"
 sum: 50
 type: "bezoeken"
 year: "2021"
[[Prototype]]: Object

但是我想要的是月、年和型別的 foreach，因為我想知道每個月、年和型別的總和是多少。因為這些資料應該在每月拆分的不同 HTML 表格中查看。

HTML 表格視圖

uj5u.com熱心網友回復：

看起來你data是一個arrayof objects，即：

var your_data = [
    {sum: 10, month: 'november', year: '2021', type: 'bezoeken'},
    {sum: 50, month: 'oktober', year: '2021', type: 'bezoeken'}
];  

所以如果你想：

• iterate 在那些 objects
• 訪問不同properties的那些objects

您可以執行以下操作：

for(var i = 0; i < your_data.length; i  ) {

    var year = your_data[i]['year']; 
    var month= your_data[i]['month']; 
    var type = your_data[i]['type'];
    var sum = your_data[i]['sum'];

    console.log("year: "   year   ", "   "month: "   month   ", "   "type: "   type   ", "   "sum: "   sum);
} 

上面的“解決方案”假設您data是您想要的方式 - 即您不需要對額外資料的年、月、型別和總和進行更多聚合。

關于將這些值放入表格中，您可以通過多種不同的方式來實作。

下面是一個簡單的示例，可以幫助您決定在解決方案中做什么或不想要什么。

如果您想使用它，這里是jsFiddle 的鏈接。

var your_data = [{
    sum: 10,
    month: 'november',
    year: '2021',
    type: 'bezoeken'
  },
  {
    sum: 50,
    month: 'oktober',
    year: '2021',
    type: 'bezoeken'
  }
];

for (var i = 0; i < your_data.length; i  ) {

  var year = your_data[i]['year'];
  var month = your_data[i]['month'];
  var type = your_data[i]['type'];
  var sum = your_data[i]['sum'];

  var row_html = `
        <tr>
            <td>${year}</td>
            <td>${month}</td>
            <td>${type}</td>
            <td>${sum}</td>
        </tr>
  `;

  $("#your_table").append(row_html);

}

#my_table {
  border: 1px solid;
}

th,
td {
  border: 1px solid #000000;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="your_table">
  <thead>
    <tr>
      <th>Year</th>
      <th>Month</th>
      <th>Type</th>
      <th>Sum</th>
    </tr>
  </thead>
  <tbody>

  </tbody>
</table>

uj5u.com熱心網友回復：

感謝user1063287，我的問題解決了。

for(var i = 0; i < your_data.length; i  ) {

    var year = your_data[i]['year']; 
    var month= your_data[i]['month']; 
    var type = your_data[i]['type'];
    var sum = your_data[i]['sum'];

    console.log("year: "   year   ", "   "month: "   month   ", "   "type: "   
    type   ", "   "sum: "   sum);
}

標籤：查询

上一篇：如何為電話號碼撰寫僅允許帶加號的號碼的正則運算式？

下一篇：將滑鼠懸停在div上時移除影像灰度效果