计算多行jquery动态表单答案

【问题标题】：Calculate multiple rows of jquery dynamic form计算多行jquery动态表单
【发布时间】：2020-01-10 13:15:53
【问题描述】：

我试图找出多行 jquery 表单的总和。但不能。

输入：

<input type="text" name="item_quantity[]" class="form-control item_quantity" " />

jQuery

$('input').keyup(function()
{ 
   var num  = Number($('#item_quantity').val());  
   var sum = 0;
   for(i=0; i<num.size(); i++)
   {
       sum += num;
       document.getElementById('total').value = sum;
   }
});

输出：

Total: <span id="total"></span>

【问题讨论】：

标签： jquery

【解决方案1】：

您正在按 id 选择：$('#item_quantity')，同时使用 name 属性。相反，您应该使用 $('[name=item_quantity[]]') 选择器。

这样的事情应该可以工作：

$('input').keyup(function()
{ 
   const $elements = $('[name=item_quantity[]]');
   let sum = 0;
   for (let i=0; i<$elements.size(); i++)
   {
       sum += Number($elements[i].val());
   }
   $('#total').html(sum);
});

您可以查看this answer 了解有关此选择器的更多信息。

【讨论】：

请注意，$('input') 选择器非常通用，请注意这一点，因为当其他非全部相关字段发生更改时，它可能会触发不必要的重新计算。

【解决方案2】：

$('input').keyup(function()
{ 
   var names=document.getElementsByName('item_quantity[]');
   var sum =0;
   for(key=0; key < names.length; key++)  
   {
      sum += Number(names[key].value);
      document.getElementById('total').value = sum;
   }
});

【讨论】：