需要遍历json数据本地存储数组中存储的json对象

Question

我查看了Iterate through nested json object array 和其他一些帖子，但它们似乎并没有解释我的情况。

我在这里遇到的问题是，如果客户端的表单离线并需要将多个提交存储到本地存储中，我必须将多个 JSON 对象存储到一个数组中到本地存储；所以当重新建立连接时，它会遍历所有的localstorage数据，并将每个JSON对象分别提交到新的行到SQL DB中。

我所拥有的只是存储到本地存储数组中的 JSON 对象数组，但我似乎无法分别返回每个“{...}”对象，我只能使用 offlinExtractData 获取数组字符串的单个值[3]（返回“cable_no”的“c”）而不是能够获取多个对象数组中的第一个 JSON 对象。

例如，将提交到 SQL DB 的完整 JSON 对象如下所示，然后通过 AJAX 发送到 PHP SQL 文件：

{"cable_no":"90012","section_no":"1","extract_ft":"1","cable_status":"","conduit_status":"None","extract_date":"2013- 09-26","extraction_team":" ","extract_notes":"1"}

这是一行数据，但这是我的本地存储在多次提交后的样子：

[{"cable_no":"90012","section_no":"1","extract_ft":"1","cable_status":"Done","conduit_status":"None","extract_date":"2013-09-26","extraction_team":" ","extract_notes":"1"},
{"cable_no":"90012","section_no":"1","extract_ft":"2","cable_status":"Done","conduit_status":"Liner 2","extract_date":"2013-09-26","extraction_team":"E1","extract_notes":"2"},
{"cable_no":"90012","section_no":"1","extract_ft":"3","cable_status":"Done","conduit_status":"Liner 2","extract_date":"2013-09-26","extraction_team":"Unknown","extract_notes":"3"},
{"cable_no":"90012","section_no":"4","extract_ft":"4","cable_status":"Done","conduit_status":"Liner 2","extract_date":"2013-09-26","extraction_team":"Unknown","extract_notes":"4"},
{"cable_no":"90012","section_no":"1.2.3","extract_ft":"333","cable_status":"Done","conduit_status":"Liner 2","extract_date":"2013-09-26","extraction_team":"Unknown","extract_notes":"5"}]

每个{...},{...},{...} JSON 对象都有自己独特的数据行，我需要能够相应地分别返回每个{...} 以通过我已经设置的AJAX 函数提交。我的问题是如何遍历每个对象以返回整个数据，而不仅仅是整个字符串的位？这有意义吗？

这是吐出上述数据的代码：

//Global variables
var extractform = {
'cable_no' : "",
'section_no' : "",
'extract_ft' : "",
'cable_status' : "",
'conduit_status' : "",
'extract_date' : "",
'extraction_team' : "",
'extract_notes' : ""
}

//initially set up the store
if (!localStorage["Extract_Update"] ) {
localStorage["Extract_Update"] = JSON.stringify([]);
}
//Now return locally stored values, if set
if (localStorage["Extract_Update"]) {
var offlinExtractData = localStorage["Extract_Update"];
console.log("Array Length: " + localStorage["Extract_Update"].length + "\nParsed Data: " + offlinExtractData);
console.log(offlinExtractData[3]);
}

function update_extractform() {
$.ajax({
    type: 'POST',
    //url: './php/update_extractform.php',
    timeout: 8000, //8 seconds
    data: extractform,
    success: function(data) {
                //Save data (array) and push new data into existing web storage
                var aa = JSON.parse( localStorage["Extract_Update"] );
                console.log( aa );
                aa.push( [ extractform ] );
                localStorage["Extract_Update"] = JSON.stringify( aa );
                console.log("Submitted (offline): " + localStorage["Extract_Update"]);
}

Answer 1

如果您有 JSON 对象的字符串表示，将其转换为 javascript 对象以进行迭代的一种方法是：

eval(offlinExtractData)[3]

在 IE 8+、Firefox 3.1+、Safari 4+、Chrome 3+ 和 Opera 10.5+（基于 Browser-native JSON support (window.JSON)）中，您还可以使用以下方法避免 eval：

JSON.parse(offlinExtractData)[3]

要获得更多支持，您还可以使用外部 JSON 解析器，例如 https://github.com/douglascrockford/JSON-js/blob/master/json2.js