0

我在使用 jQuery Mobile 和 Icenium 开发的混合应用程序的 index.htm 和 main.js 文件中有以下代码。我试图在 HTML 表中显示从对 Web 服务的 ajax 调用获得的 JSON 数据（对象数组）。在下面的 jQuery 代码中，保存这个 JSON 对象数组的变量称为“msg”。

问题是我在这个问题的末尾粘贴了表格的 html。如何确保我的输出正确且不歪斜？

索引.html

 <div id="dataDiv" ><table bgcolor="aliceblue" id="employeesTable"></table></div>

main.js

                //bind the table
                //1.create column headings
                $("<thead><tr>").appendTo('#employeesTable');
                $('<th>#</th>').appendTo('#employeesTable');
                $.each(msg[0], function(key, val) {
                    $('<th>' + key + '</th>').appendTo('#employeesTable');
                });
                 $('<tr></thead><tbody>').appendTo('#employeesTable');
                //2.populate column data into appropriate cells

                $.each(msg, function(index, val) {
                    $('<tr>').appendTo('#employeesTable');
                    $('<td>' + (index + 1) + '</td>').appendTo('#employeesTable');
                    $.each(msg[index], function(key, val) {
                        $('<td id="' + key + '">' + val + '</td>').appendTo('#employeesTable');
                    });
                    $('</tr>').appendTo('#employeesTable');
                });
                  $('</tbody>').appendTo('#employeesTable');

来自 jQuery 上面的偏斜输出

  <table bgcolor="aliceblue" id="employeesTable">
  <thead>
    <tr></tr>
  </thead>
 <th>#</th>
 <th>FirstName</th>
 <th>LastName</th>
 <th>Age</th>
 <th>YearsInJob</th>
 <th>IsManager</th>
 <tbody>
  <tr></tr>
  <tr></tr>
  <tr></tr>
  <tr></tr>
</tbody>
<td>1</td>
<td id="FirstName">Sunil</td>
<td id="LastName">Jha</td>
<td id="Age">28</td>
<td id="YearsInJob">6</td>
<td id="IsManager">true</td>
<td>2</td>
<td id="FirstName">Nikolay</td>
<td id="LastName">Rebello</td>
<td id="Age">35</td>
<td id="YearsInJob">6</td>
<td id="IsManager">true</td>
<td>3</td>
<td id="FirstName">Mike</td>
<td id="LastName">Newton</td>
<td id="Age">32</td>
<td id="YearsInJob">2</td>
<td id="IsManager">false</td>
<td>4</td>
<td id="FirstName">Paul</td>
<td id="LastName">Samath</td>
<td id="Age">24</td>
<td id="YearsInJob">2</td>
<td id="IsManager">false</td>
</table>
4

1 回答 1

1

您应该仅将 thead 和 tbody 元素附加到 employeesTable 中，然后将您需要的表格行附加到 thead 和 tbody 中，最后将单元格附加到每一行。

为此，只需将您正在创建的元素分配给一个变量，您将需要附加一些元素。然后，附加到这些变量而不是 employeesTable

于 2013-12-29T00:47:08.920 回答