SUM動的にjQueryのフィールドを追加しました

Question

テーブルに行を動的に追加できるテーブルがあります。しかし、私はテーブルの一番下に小計を入れることができるようにしたいと思います。

はJavaScript：

$(document).on('change', 'input[name^="shipment_details[charge][]"]', function() { 
    var sum = 0; 
    $('input[name^="shipment_details[charge][]"]').each(function(){ 
     sum += +$(this).val(); 
    }); 
    $('input[name^="freightBillSubtotal"]').val(sum); 
}); 

HTML

<input type="text" class="qty1" value="" name="shipment_details[charge][]"/> 
<input type="text" class="qty1" value="" name="shipment_details[charge][]"/> 
<input type="text" class="qty1" value="" name="shipment_details[charge][]"/> 
<input type="text" class="qty1" value="" name="shipment_details[charge][]"/> 
<input type="text" class="qty1" value="" name="shipment_details[charge][]"/> 

しかし、私はJSFiddleにして遊ぶので、私がやっている場合、私は好奇心旺盛だとき、これは動作しません。これまでのところ私のようなものを持っています間違ったjavascriptの名前部分、または私はそれをすべて一緒にやっていない場合。私は、小計を「預金」のための私のテキストフィールドには、次のだと言う必要があります：私はあなたを理解していれば

<input type="text" readonly name="freightBillSubtotal" id="freightBillSubtotal"> 

Answer 1

は、あなたが入力中のすべての値の合計を取得したいです！ はそれを試してください：

$(document).on('change', 'input[name^="shipment_details[charge][]"]', function() { 
    var sum = 0; 
    $('input[name^="shipment_details[charge][]"]').each(function(index,elem){ 
     let value = $(elem).val(); 
     if(typeof value ==="number"){ 
     sum += +value; 
     } 
    }); 
$('input[name^="freightBillSubtotal"]').val(sum); 
    console.log(sum) 
}); 

は、私はクラスセレクタの代わりに、複雑なセレクターを使用することをお勧めします。コードは簡単です。