我是javascript和jQuery新手。我已经加载了jsondata.json
文件。我需要帮助循环通过所有的数据,并显示在一个HTML表中,当用户单击一个按钮。
<script>
var a = {};
$.getJSON('JsonData.json', function (data) {
a = data;
});
</script>
我的表结构如下:
<table>
<tr>
<th>ID</th>
<th>Name</th>
<th>IDNumber</th>
</tr>
</table>
我的“jsondata.json”文件结构如下:
[
{
"ID": 1,
"Name": "John Smith",
"IDNumber": "7606015012088"
},
{
"ID": 2,
"Name": "Molly Malone",
"IDNumber": "8606125033087"
},
{
"ID": 3,
"Name": "Rianna Chetty",
"IDNumber": "6207145122087"
},
{
"ID": 4,
"Name": "Gregory Nazul",
"IDNumber": "8112125042088"
},
{
"ID": 5,
"Name": "Mary Billat",
"IDNumber": "9103317012087"
},
{
"ID": 6,
"Name": "Harry Popadopalous",
"IDNumber": "7206085031088"
},
{
"ID": 7,
"Name": "Jim Beam",
"IDNumber": "5101236012088"
}
]
您可以使用以下内容:
<script>
var a = {};
$.getJSON('JsonData.json', function (data) {
a = data;
$.each(a, function(idx, elem){
$('table#tbl TBODY').append('<tr><td>'+elem.ID+'</td><td>'+elem.Name +'</td><td>'+elem.IDNumber +'</td></tr>');
});
});
</script>
<table id="tbl">
<thead><tr><th>ID</th><th>Name</th><th>IDNumber</th></tr></thead>
<tbody></tbody>
</table>