javascript - 从输入数组的元素中获取总和

Question

我在一个看起来像这样的表中有多行。

<tr>
<td>Item 1</td>
<td><input type=TEXT name="item_name[]"  /></td>
<td><input type=TEXT name="item_desc[]"  /></td>
<td><input type=TEXT name="item_type[]"  /></td>
<td><input type=TEXT name="item_price[]" /></td>
<td><input type=TEXT name="item_setup[]" /></td>
<td><input type=TEXT name="item_quant[]" /></td>
</tr>

ETC...

用户可以动态添加或删除更多行。

我正在尝试执行 JS 部分，该部分将显示所有 item_price*item_quant 的总和，并在 keyup 或模糊或更改时将其显示在该位内。

<tr><td id=total></td></tr>

编辑：到目前为止尝试了以下。在下面调用 updateTotal() 的每个字段中添加了一个“onblur”：

function updateTotal() {
var total = 0; 

$("input[id^='item_quant[']").each(function() {
    if (!isNaN(this.value) && this.value.length != 0) {
        total += parseFloat(this.value);
    }
});

$("#total").val(total);
}

但还是不行

Answer 1

尝试

$('table').on('change', 'input[name="item_price[]"], input[name="item_quant[]"]', function() {
    var total = 0;
    $('table').find('tr').each(function() {
        var $this = $(this);
        var amount = (parseFloat($this.find('input[name="item_price[]"]').val(), 10) || 0)
        * (parseFloat($this.find('input[name="item_quant[]"]').val(), 10) || 0);
        total += amount;
    })

    $('#total').text(total)
})

演示：小提琴

Answer 2

 $(".txt").each(function () {

         //add only if the value is number
         if (!isNaN(this.value) && this.value.length != 0) {
             sum += parseFloat(this.value);
         }

     });

JSFIDDLE 演示

Answer 3

您可以通过将每个元素值转换为整数然后执行求和数学来做到这一点。

例子

var add = 0;
$("input").each(function()
{
     add += Number($(this).val());//for integer
     //add += parseFloat($(this).val());//for float or decimal
});
$("#total").html("Sum of all textboxes is : " + add);