JSON來HTML表格：多個條目和列

Question

我有我試圖把成HTML表格此JSON數據：

{ 
"users":{ 
    "key":[ 
    "3128", 
    "3108" 
    ], 
    "name":[ 
    "jason", 
    "fred" 
    ] 
} 
} 

我想讓這兩個表中的重點和名稱分隔列。我正在使用這個jQuery代碼。它將數據正確放置在每列中，但是它複製數據。我猜測它是因爲我正在循環多次。

var url = "http://localhost/test.php"; 
$.getJSON(url,function(data){ 
var table = '<table><thead><tr><th>Key</th><th>Name</th></tr></thead><tbody>'; 
    $.each(data, function(i, param) { 
      $.each(param['key'], function(l, k) { 
      $.each(param['name'], function(l, p) { 
        table +="<tr><td>" + k + "</td>"+"<td>" + p + "</td></tr>"; 
               }); 
              }); 
            }); 
    table += '</tbody></table>'; 
    $("#jsondata").html(table); 
}); 

如何停止在我創建的列中複製數據？

非常感謝幫助！

Answer 1

我會做這樣的（在getJSON功能的閉包）：

var table = '<table><thead><tr><th>Key</th><th>Name</th></tr></thead><tbody>'; 
var users = data.users; 
$.each(data.users.key, function(i, key) { 
    table +="<tr><td>" + key + "</td>"+"<td>" + data.users.name[i] + "</td></tr>"; 
}); 
table += '</tbody></table>'; 

下面的代碼中的jsfiddle：http://jsfiddle.net/QchnP/

的說明：在行$.each(data, function(i, param) {你會遍歷每個JSON字典的屬性，這不是必需的（如果您只對users值有興趣）。