jquery - 从 JSON 数据填充大表行

Question

我正在尝试使用 JSON 数据填充表格

这就是我的想法

$.ajax({
  dataType: "json",
  url: "music.json"
})
.done(function(gamesjson){
    DATA = gamesjson;
    buildTable(DATA ); // this one is calling the above code
  })
.fail(function(){
    console.log("music.json error");
  })
;

function buildTable(DATA){
var gl = $("#gl");
$.each(DATA.music, function(index, value) {
// code to populate table
??

}

$("#gl").append(gl);
}

我在 buildTable() 中写了什么？另外，如果我的 json 包含 1000 行，那么构建表的最佳方法是什么？

请举例说明。谢谢

http://jsfiddle.net/9u4zR/1/

Answer 1

像这样的东西：

function buildTable(DATA){
    var table = "<table>";
    $.each(DATA.music, function(index, value) {
        table += "<tr><td>" + value.col1 + "</td><td>" + value.col2 + "</td></tr>";
    }
    table += "</table>";
    $("#gl").append(table);    
}

当然，您需要将col1和替换col2为您的实际属性的名称，并根据需要添加更多列。您可能还想指定类或样式。但这向您展示了一般结构，您可以根据应用程序的需要对其进行改进。

Answer 2

使用java 脚本模板 技术，它将帮助您在客户端呈现 JSON 响应，我将doT.js 与 php 一起使用，它可以帮助您创建 html 模板并将对象绑定到它