javascript - 如何使用jquery以表格形式动态显示json数据？

Question

我有这样的 json 数据

{
    Qty:[61.0,0.0,8.0],
    Name:["2009 A","2009 B","2009 C "]
}

我必须在html中以表格格式显示它，这样所有三个元素都应该显示在表格的不同行中。它还应该能够分别包含单个名称和数量，也可以包含多个(如果需要)。在这方面如有任何帮助，我们将不胜感激。

Answer 1

您可以看到下面的代码如何迭代 $.each 循环

$(document).ready(function (e) {
        var t = { Qty: [61.0, 0.0, 8.0], Name: ["2009 A", "2009 B", "2009 C "] }
        $.each(t.Qty, function (i, ele) {
            $("#content").append("<tr><td><input type='checkbox' /></td><td>" + parseFloat(t.Qty[i]).toFixed(1) + "</td><td>" + t.Name[i] + "</td></tr>");
        })
    })

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<table>
    <thead>
        <tr>
            <th>Select </th>
            <th>Qty</th>
            <th>Name</th>
        </tr>
    </thead>
    <tbody id="content">
    </tbody>
</table>