0

いくつかの入力フィールドがあります

<input type="text" name="quantity[]" class="est_quantity" placeholder="quantity"/>
<input type="text" name="quantity[]" class="est_quantity" placeholder="quantity"/>
<input type="text" name="quantity[]" class="est_quantity" placeholder="quantity"/>

<input type="text" name="cost[]" class="est_cost" placeholder="cost"/>
<input type="text" name="cost[]" class="est_cost" placeholder="cost"/>
<input type="text" name="cost[]" class="est_cost" placeholder="cost"/>

私はいくつかの計算を実行する必要があります。

//Calculate total Quantity, this is how i do it.
$('.est_quantity').live('keyup', function(){
    var val = 0;
    $('.est_quantity').each(function() {
        if($(this).val().length && $(this).val() != '') {
            val += Number($(this).val());
            $('.est_total_quantity').html(val);
        }
    });
});

quantity[]総量はすべての合計ですが、総コストの計算はほとんど変わらないため、上記のコードは正常に機能します。計算はこうなるから。

total cost = total_quantity * cost
//for each field or row.

コストの計算中に、値に対応する数量フィールドを掛けたいと思います。

何かのようなもの

var cost = $('.est_quantity').val * $('.est_cost').val();

私はこのようにしてみました

$('.est_cost').live('keyup', function(){
    var val = 0.00;
    $('.est_cost').each(function() {
        if($(this).val().length && $(this).val() != '') {
            var cost = $(this).val() * $('.est_quantity').val();
            val += parseFloat(cost);
            $('.est_total_cost').html(val.toFixed(2));
        }
    });
});

上記のコードは、最初の行のみに対して適切な計算をフェッチし、残りの部分では奇妙な値をフェッチします。

適切な計算のためにコードを使用するにはどうすればよいですか?

PS: 最初は、数量とコストの入力フィールドを含む 1 行の入力フィールドがあり、残りの入力フィールドはクリック イベント時に動的に追加されます。

ありがとうございました

4

4 に答える 4

1 
$(document).on('keyup', '.est_cost, .est_quantity', function(){
    var result = 0,
        $cost = $('.est_cost'),
        $quant = $('.est_quantity');

    $.each($cost, function(i) {
        var costVal = parseFloat( $cost.eq(i).val() ),
            quantVal = parseFloat( $quant.eq(i).val() );

        if (quantVal && costVal) {
            result += costVal * qantVal;
        }
    });

    $('.est_total_cost').text( result.toFixed(2) );
});
于 2012-05-04T08:07:30.827 に答える
1

.est_quantity2 番目のコード サンプルでは、 ​​class を持つ要素を反復処理するときに 1 つを選択する必要がある class を持つ要素が複数あることに注意する必要があります.est_cost。
このようなもの

$('.est_cost').live('keyup', function(){
    var val = 0.00;
    $('.est_cost').each(function(i) {
        if($(this).val().length && $(this).val() != '') {
            var cost = $(this).val() * $('.est_quantity').eq(i).val();
            val += parseFloat(cost);
            $('.est_total_cost').html(val.toFixed(2));
        }
    });
});

index各関数のパラメーターを使用していることに注意してください。.est_quantity注:- 要素と.est_cost要素の数が等しいと仮定します

于 2012-05-04T08:07:42.700 に答える
1 
$('.est_cost').each(function(index,val) {
        if($(this).val().length && $(this).val() != '') {
            var cost = $(this).val() * $('.est_quantity:eq('+ index +')').val(); //here eq(index) maintain the order
            val += parseFloat(cost);
            $('.est_total_cost').html(val.toFixed(2));
        }
    });
于 2012-05-04T08:08:01.457 に答える
0

.val()配列を返します。計算を実行する前に、parseFloat()または実行する必要があります。parseInt()

于 2012-05-04T08:01:26.007 に答える