首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
您现在的位置: 程式碼之家 >> 編程語言 >  >> 更多程式語言 >> 程式設計疑難解答

JavaScript 遍歷包含分頁字段的 JSON 陣列

     編輯:程式設計疑難解答

問題場景

後端回傳 JSON 結構包含分頁資訊(curPage、totalPage)與資料陣列 title:

{
  "curPage": "1",
  "totalPage": "1",
  "title": [
    {"id":22, "title":"《蘑菇戰爭》通關技巧防守篇", ...},
    {"id":23, "title":"《蘑菇戰爭》通關技巧進攻篇", ...},
    {"id":24, "title":"《蘑菇戰爭》游戲攻略 新手必看", ...}
  ]
}

使用 `$.each` 直接遍歷整個物件會報錯,僅遍歷 title 陣列則正常。

正確遍歷方式

var data = /* 取得的 JSON 物件 */;
// 只遍歷資料陣列
$.each(data.title, function(index, item) {
    console.log(item.id, item.title);
    // 這裡渲染每一項
});

// 若需分頁資訊
console.log("當前頁:" + data.curPage);
console.log("總頁數:" + data.totalPage);

常見錯誤

`$.each(data, ...)` 會嘗試遍歷所有鍵值(包含字串類型的 curPage),導致內層邏輯失敗。請**明確指向陣列屬性**。

補充:舊版 IE 相容

IE7 及以下需引入 json2.js 以支援 `JSON.parse`/`JSON.stringify`。

  1. 上一篇文章:
  2. 下一篇文章:
Copyright © 程式碼之家 All Rights Reserved