jquery - jQueryで類似の入力名を集計する

Question

名前/IDが増加する動的に作成された入力がいくつかあります。したい：

1. すべての空白の入力を見つけてゼロで埋める
2. 入力した数字をすべて合計する
3. その合計を別の入力に入れます

jQuery 1.9.1 を使用しています。

このような行：

<input type="text" name="Amount1" id="Amount1" value="0" class="Amount">
<input type="text" name="Amount2" id="Amount2" value="" class="Amount">
<input type="text" name="Amount3" id="Amount3" value="10" class="Amount">
<input type="text" name="Amount4" id="Amount4" value="150" class="Amount">

合計を次のように入力します。

<input type="text" name="Totals" id="Totals" value="" class="Totals">

これは私がうまくいくかもしれないと思っていたものですが、近くにはありません:

$('input[name^="Amount"]').each(function(){
    var emptyTextBoxes = $('input:text').filter(function() { return this.value == ""; });
    emptyTextBoxes.each(function() {
        //total up numbers
          ???
    });
});

Answer 1

確かに、それははるかに簡単に行うことができます。最初のステートメントは、必要なすべての入力フィールドをすでに選択しています。

var total = 0;

$('input[name^="Amount"]').each(function() {
    total += parseInt(this.value, 10) || 0;
});

$('#Totals').val(total);

parseInt()空の値が返さNaNれるので、|| 0コンストラクトを使用してそれらを効果的にスキップします (つまり0、合計に追加します)。

Answer 2

あなたはそれらを要約することができます：

var total = 0;

emptyTextBoxes.each(function() {
    total += parseInt(this.value, 10);
});

または、.map()新しいブラウザで:

var total = emptyTextBoxes.map(function() {
    return parseInt(this.value, 10);
}).get().reduce(function(a, b) {
    return a + b;
});

Answer 3

var total = 0;
$(".Amount").each(function() {
    if (this.value == '') { this.value = 0; }
    total += parseInt(this.value);
});
$('.Totals').val(total);

http://jsfiddle.net/jfGbq/