在javascript中向现有表添加行

时间:2016-03-16 06:40:42

标签: javascript jquery jsp

伙计们我知道这是一个虚拟的问题,但我花了几个小时在这里,无法达到...我想在现有的表中添加行,这行由复选框和4个文本框组成..当我运行它时,文本框出现但是复选框不要..这是我的代码

function addRow() {
var i = 1;
var table = document.getElementById("table");
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);    
var html = [];
html.push("<table id='table'>\n<body>");
html.push("<tr><td><input type='checkbox' name='chk'/></td>");
var cell = row.insertCell(html);

for ( var propertyNames in grid.data[0]) {
    cell = row.insertCell(i);

    var element = document.createElement("input");
    element.type = "text";
    element.size = 10;
    element.name = "input"+i;
    cell.appendChild(element);
    html.push("<td>" + cell + "</td>");
    i++;
}
html.push("</tr>");
html.push("</body>\n</table>");
}

1 个答案:

答案 0 :(得分:0)

问题是您正在创建一个带有复选框标记的数组,但它永远不会添加到表中

function addRow() {
  var i = 1;
  var table = document.getElementById("table");
  var rowCount = table.rows.length;
  var row = table.insertRow(rowCount);
  var cell = row.insertCell();
  var element = document.createElement("input");
  element.type = "checkbox";
  element.name = "chk";
  cell.appendChild(element);

  for (var propertyNames in grid.data[0]) {
    cell = row.insertCell(i);

    element = document.createElement("input");
    element.type = "text";
    element.size = 10;
    element.name = "input" + i;
    cell.appendChild(element);
    i++;
  }
}

var grid = {
  data: [{
    x: 1,
    y: 1
  }]
};
addRow();
<table id="table"></table>