JavaScript 克隆表行 - 重置值

Question

我设置了一个表单/表格，它克隆具有特定值名称的行，以便在表单提交后可以单独处理它们。一切似乎都很好，除非您在第 5 行（被克隆的行）填写信息，然后将所有数据复制到克隆的行中。

在克隆过程中是否有简单的方法将值重置为 NULL 和 0？

（我在底部有两行对每一列进行统计/总计，因此是tr:nth-last-child(2)）

var totalRows = 5;

function addrow() {
  totalRows++;
  var clonedRow = $("table#maintable tr:nth-child(5)").clone(); //this will grab the 5th table row.

  //get the textfield
  var tfName = $("input.name",clonedRow);
  var tfproA = $("input.proA",clonedRow);
  var tfproB = $("input.proB",clonedRow);
  var tfproC = $("input.proC",clonedRow);
  var tfproD = $("input.proD",clonedRow);
  var tfproE = $("input.proE",clonedRow);
  var tfproF = $("input.proF",clonedRow);
  var tfproG = $("input.proG",clonedRow);
  var tfproH = $("input.proH",clonedRow);
  var tfproI = $("input.proI",clonedRow);
  var tfproJ = $("input.proJ",clonedRow);
  var tfproK = $("input.proK",clonedRow);
  var tfproL = $("input.proL",clonedRow);
  var tfproM = $("input.proM",clonedRow);
  var tfproN = $("input.proN",clonedRow);

  //change their names
  tfName.attr("name","name"+totalRows);
  tfproA.attr("name","proA"+totalRows);
  tfproB.attr("name","proB"+totalRows);
  tfproC.attr("name","proC"+totalRows);
  tfproD.attr("name","proD"+totalRows);
  tfproE.attr("name","proE"+totalRows);
  tfproF.attr("name","proF"+totalRows);
  tfproG.attr("name","proG"+totalRows);
  tfproH.attr("name","proH"+totalRows);
  tfproI.attr("name","proI"+totalRows);
  tfproJ.attr("name","proJ"+totalRows);
  tfproK.attr("name","proK"+totalRows);
  tfproL.attr("name","proL"+totalRows);
  tfproM.attr("name","proM"+totalRows);
  tfproN.attr("name","proN"+totalRows);

  $("table#maintable tr:nth-last-child(2)").before(clonedRow); //add the row back to the table before the last 2nd to last row
  console.log('done')
}

Answer 1

您可以将调用 val() 链接在一起

tfName.attr("name","name"+totalRows).val(0) 或

tfName.attr("name","name"+totalRows).val('')