Question

JSON结构：

{“rows”：[

 {"row":[ 
      {"cells": [
     {"data": "Edit"},
     {"data": "030194"},

      ]}
 ]},
 {"row":[
      {"cells": [
     {"data": "Add"},
     {"data": "030194"},
      ]}
 ]},
 {"row":[
      {"cells": [
     {"data": "Delete"},
     {"data": "030194"},
      ]}
 ]}

]}

JQuery代码：

$。each（response.rows，function（index，rows）{

 $.each(rows.row, function(index,row){ 
      var element=$("tbody").append("<tr id='" + index + "'>");  
      var element1=element.append("<td><input type='checkbox'></input></td>");
      $.each(this.cells, function(index){ 
           element1.append("<td>" + this.data + "</td>"); 
      });
      $("tbody").append("</tr>"); 
 });

}）;

问题：

生成的每一行都有一个ID为index = 0的ID.Row1的ID应为0，Row2的ID应为1，Row3的ID应为2
td元素被绘制为tbody的子元素。他们应该是tr
关闭tr应该在每行的最后一个单元格之后绘制，当前tr在绘制任何单元格之前自行关闭

Answer 1

试试这个。这让我感到困惑，因为我在循环遍历DOM元素的上下文中习惯了.each（）的语法。因为它是$ .each（），所以第一个循环的索引指的是你想要为每一行获得的数字。

我将TR附加到你所拥有的循环之外。

（Last-child不是添加TD的最快方法，你可以使用像Endophage发布的createElement，然后参考那个）

http://jsfiddle.net/EY4an/

$.each(response.rows, function(index, rows) {

    $("tbody").append('<tr id="index' + index + '"></tr>');

    $.each(this.row, function(index) {
        var element1 = $("tbody tr:last-child").append("<td><input type='checkbox'></input></td>");
        $.each(this.cells, function(index) {
            element1.append("<td>" + this.data + "</td>");
        });
    });
});

我还在表行的ID属性中添加了'index'这个词，因为ID应该以字母开头。

Answer 2

对于索引问题不是100％肯定，但就渲染而言，这是一个分解：

var element=$("tbody").append("<tr id='" + index + "'>");

我认为这是你的错误开始的地方，在上面一行，元素将等于tbody，而不是tr。

var element1=element.append("<td><input type='checkbox'></input></td>");

现在，您现在将td附加到tbody，然后element1也将等于tbody。因此，为什么每个内部的下一个附加不能正常工作。最后，您应该只追加整个元素，因此将<tr>和</tr>附加为两个单独的操作永远不应该起作用。

尝试以下方法：

var row = document.createElement('tr');
row.setAttribute('id', index);
$("tbody").append(row);  
$(row).append("<td><input type='checkbox'></input></td>");
$.each(this.cells, function(index){ 
    $(row).append("<td>" + this.data + "</td>"); 
});
$("tbody").append(row);

只是想一想索引问题。您使用名称index两次。尝试为其中一个使用不同的变量名称。

表格单元格未在其表格行中呈现

2 个答案: