HTML，jQuery-更新表单后打印值-在数组中输入

我有一个带有输入表单的表格，上面有这样的字段。此外，我有功能添加行后，点击下面

我的问题是如何动态显示更改后的所有值的总和，例如Field1

<table id="table">
    <tr>
      <td>Date</td>
      <td>Field 1</td>
      <td>Field 2</td>
    </tr>
    <tr>
      <td><input type="text" name="count[]" placeholder="Date"></td>
      <td><input type="text" name="field1[]"></td>
      <td><input type="text" name="field2[]"></td>
    </tr>
    <input type="button" value="Add Row" onclick="addRow('table')" />
  </table>

日期
字段1
字段2

以下是jQuery：

function addRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var $row = '<tr>'+
      '<td><input type="text" name="count[]" placeholder="Date"></td>'+
      '<td><input type="text" name="field1[]"></td>'+
      '<td><input type="text" name="field2[]"></td>'+
'</tr>'
if( rowCount <= 15)
  $('#table').append($row);
else {
  alert("Error.");
}

函数addRow（tableID）{
var table=document.getElementById（tableID）；
var rowCount=table.rows.length；
var$row=''+
''+
''+
''+
''
如果（rowCount您需要在
field1[]
的某个父级上绑定一个更改事件并将其委托给他们，以便在任何
field1[]
输入更改时随时触发它，即使它是新的

调用array
reduce（）
将有助于您对值进行求和（请注意，这是针对IE9+。对于较旧的浏览器，您必须以旧的方式求和）

请注意，我假设您的SUM\u FOR\u FIELD1 span标记有一个名为
.SUM\u field\u 1

如果可能的话，在每个
字段1[]
中添加一个类，这样选择器就会更容易，因为选择“按名称”属性非常昂贵

<span>SUM_FROM_FIELD1</span>

$("#table").on("change", "[name^=field1]", function() {
    var result = Array.reduce($("[name^=field1]"), function(carry, input) {
        return carry + parseInt($(input).val());
    }, 0);
    $(".sum_field_1").text(result);
}