Berechnen Sie die Summe mehrerer Eingabenummern mit JQuery

Question

Ich habe 3 Eingaben und versuche, die Summe der Zahlen zu erhalten, jedes Mal wenn ein Benutzer eine davon aktualisiert.

HTML

JS

var sum = 0;
$('.my-input').each(function(index, elem){
  var value = $(this).val();

  sum += parseFloat($(elem).val());
  console.log(sum);

  $(this).on('keyup click', function (){

    sum += parseFloat($(elem).val());

  });
});

Aber ich erhalte immer verrückte Ergebnisse...

EDIT:

Ich habe das versucht:

  function getSum(){
    var sum = 0;
    $('.my-input').each(function(index, elem){
      var value = $(this).val();

      sum += parseFloat($(elem).val());

    });

     return sum;
  }

  $('.my-input').each(function(){
    $(this).on('keyup click', function(){
      console.log( this.value );
      var curSum = getSum();

      console.log('current sum: ' + curSum);
    });
  });

Answer 1

Betrachten Sie dieses Beispiel:

// nur das keyup-Ereignis erfassen
$('.my-input').on('keyup', function(){
    var total = 0;
    // Bei jedem Tastenanschlag alle Elemente durchlaufen und alle Ergebnisse addieren
    $('.my-input').each(function(index, element) {
        var val = parseFloat($(element).val());
        if( !isNaN( val )){
           total += val;
        }
    });
    $('#total').val(total);
});