從jquery閱讀json

Question

大家好，我正在嘗試閱讀一些json並做兩件事情。 將一些json數據插入到UL中。第二件事是創建一個函數，可以從錨標籤調用並顯示其他數據。讓我試着解釋我的代碼。

的json看起來像這樣

[{lakeName:"Lake 1",lakeCode:"111",Readings[["24-Oct-10",12.5],["24-Oct-10",10.5],["24-Oct-10",15.5],]}{lakeName:"Lake 2",lakeCode:"222",Readings[["24-Oct-10",12.5],["24-Oct-10",10.5],["24-Oct-10",15.5],]}] 

我試圖填充這樣

$(document).ready(function() { 
     $.ajax({ 
      url: "http://theaboveJSONisreturnedFromMyUrl", 
      method: 'GET', 
      dataType: 'json', 
      success: onDataReceived 
     }); 



     var data = []; 

     function onDataReceived(series) { 

      data = [series]; 
      $(data).each(function (i, data) { 
       $('#myList').append("<li>" + "<a href=\"javascript:GetLake(" + data.lakeCode + ");\">" + data.lakeName + "</a></li>"); 
      }); 

     } 
    }); 

      function GetLake(lake) { 

      alert('some how get the readings for the clicked lake code e.g. lakeCode 111 and display them here ["24-Oct-10",12.5],["24-Oct-10",10.5],["24-Oct-10",15.5]); 

      } 

現在我看到的數據值，我的名單，但是我不能似乎通過例如訪問data.lakeCode

我做錯了什麼？

任何幫助將是偉大的！

Answer 1

在您的JSON中有幾個語法錯誤。它應該是這樣的：

[{lakeName:"Lake 1",lakeCode:"111",Readings:[["24-Oct-10",12.5],["24-Oct-10",10.5],["24-Oct-10",15.5]]},{lakeName:"Lake 2",lakeCode:"222",Readings:[["24-Oct-10",12.5],["24-Oct-10",10.5],["24-Oct-10",15.5]]}] 

一些:和,人失蹤，在之間產生不必要的,和不必要的]是在年底。

Answer 2

當你不知道自己的JSON的語法只是與檢查： http://www.jsonlint.com/

Answer 3

爲了有效，你的JSON需要進行以下更改（you can check always validity with JSONLint here）：在對象之間

• 逗號主陣列
• Readings陣列中沒有尾隨命令
• 成員名稱雙引號
並將其值

在所有之間

:它應該是這樣的：

[{"lakeName":"Lake 1","lakeCode":"111","Readings":[["24-Oct-10",12.5],["24-Oct-10",10.5],["24-Oct-10",15.5] ]},{"lakeName":"Lake 2","lakeCode":"222","Readings":[["24-Oct-10",12.5],["24-Oct-10",10.5],["24-Oct-10",15.5] ]}] 
//compared to your current version: 
[{ lakeName :"Lake 1", lakeCode :"111", Readings [["24-Oct-10",12.5],["24-Oct-10",10.5],["24-Oct-10",15.5],]} { lakeName :"Lake 2", lakeCode :"222", Readings [["24-Oct-10",12.5],["24-Oct-10",10.5],["24-Oct-10",15.5],]}] 

此外，你應該在這裏使用$.each()代替，就像這樣：

$.each(data, function() { 
    $('#myList').append("<li>" + "<a href=\"javascript:GetLake(" + this.lakeCode + ");\">" + this.lakeName + "</a></li>"); 
}); 

還是一個比較好，使用像這樣的DOM方法：

$.each(data, function() { 
    $('<a />', { href: '#', click: function() { GetLake(this.lakeCode); } }) 
    .wrap('<li />').parent().appendTo('#myList'); 
});