Question

我正在努力遍历表格单元格并将值插入其中。但我不知道我的代码有什么问题。请帮帮我。我知道有一些愚蠢的错误。请让我们我知道它是什么。这是我的代码 -

 var data = response.datas.length;
              var table = document.getElementById('itemsval');
              for(var i=0; i<data; i++ ){
                var row = table.insertRow(i);
                for(var j=0; j<7; j++){
                 var cell = row.insertCell(j);


                cell[i][j].innerHTML = response.datas[i].p_name;
                 cell[i][j].innerHTML = response.datas[i].p_details;
                 cell[i][j].innerHTML = response.datas[i].p_qty;
                 cell[i][j].innerHTML = response.datas[i].p_rate;
                 cell[i][j].innerHTML = response.datas[i].p_dis;
                 cell[i][j].innerHTML = response.datas[i].p_tax;
                 cell[i][j].innerHTML = response.datas[i].p_tot; 
                }

              }

我一直收到错误 - 无法读取属性＆＃39; 0＆＃39;未定义的

提前致谢。

Answer 1

在第一次迭代中，这一行

cell[i][j].innerHTML = response.datas[i].p_name;

尝试在0内访问名为cell的媒体资源。 cell将没有名为0的属性（来自变量i）。如果是，那么该属性的值将不具有名称为0的属性（来自变量j）。

另外，重复写到同一个地方：

cell[i][j].innerHTML = response.datas[i].p_name;
cell[i][j].innerHTML = response.datas[i].p_details;

...会导致以后的值覆盖之前的值。

相反，您希望在出发时向行中添加一个单元格，并设置该单元格的内容。让我们给自己一个方便的功能：

function addCell(row, content) {
    var cell = row.insertCell();
    cell.appendChild(
        document.createTextNode(content)
    );
    return cell;
}

添加单元格，以不必担心HTML标记的方式设置其内容，并返回单元格。

现在，让我们在你的代码中使用它：

// Get the table
var table = document.getElementById('itemsval');

// Add the rows
response.datas.forEach(function(entry) {
    var row = table.insertRow();
    addCell(row, entry.p_name);
    addCell(row, entry.p_details);
    addCell(row, entry.p_qty);
    addCell(row, entry.p_rate);
    addCell(row, entry.p_dis);
    addCell(row, entry.p_tax);
    addCell(row, entry.p_tot); 
});

请注意该代码如何通过response.datas循环遍历Array#forEach数组。 You have lots of other options （这也是我的答案），但在这种情况下似乎最简单。

使用javascript循环遍历html表格单元格

1 个答案: