Wie wird der Eingabewert aktualisiert, ohne auf das Eingabefeld zu klicken?

Question

So habe ich Problem, dass mein Eingabewert nur aktualisiert wird, wenn ich auf Eingabefeld geklickt habe ("Total" Eingabefeld, unter "Suma" ("Kiekis" * "Kaina" = "Suma") Spalte und die nur gelesen wird), aber ich möchte automatisch "Summen" -Feld aktualisieren (Das ist am unteren Rand in der Nähe von "Bendra Suma").

JS-Code:

$(document).on('keyup change', '.quantity, .price', function() { 
    var row = $(this).closest('tr').get(0); 
    var rowPrice = $(row).find('.price').val(); 
    var rowQuantity = $(row).find('.quantity').val(); 

    $(row).find('.total').val((rowPrice * rowQuantity).toFixed(2)); 

    $('.total').blur(function() { 
     var sum = 0; 

     $('.total').each(function() { 
      sum += parseFloat($(this).val()); 
     }); 

     $('#totals').val((sum).toFixed(2)); 
    }); 

}); 

Sie können testen, wie es in JSFiddle funktioniert:

https://jsfiddle.net/xqy6qafk/

Vielen Dank im Voraus für die Hilfe!

Answer 1

Sie brauchen nicht den Code in Unschärfe Event-Handler zu setzen ...

Legen Sie es in keyup/Wechsel Event-Handler-Seite. ..

8. Zeile

$(document).on('keyup', '.quantity, .price', function() { 

und zweite letzte Zeile entfernen ...

}); 

So haben Sie etwas, das wie folgt aussieht ...

$(document).on('keyup change', '.quantity, .price', function() { 
    var row = $(this).closest('tr').get(0); 
    var rowPrice = $(row).find('.price').val(); 
    var rowQuantity = $(row).find('.quantity').val(); 

    $(row).find('.total').val((rowPrice * rowQuantity).toFixed(2)); 

    var sum = 0; 

    $('.total').each(function() { 
     sum += parseFloat($(this).val()) || 0; // If a string is entered, use 0 instead. 
    }); 

    $('#totals').val((sum).toFixed(2)); 

}); 

Answer 2

entfernen ändern, damit es auf keyup aktivieren werde

$(document).on('keyup', '.quantity, .price', function() { 

Answer 3

Dies aktualisiert die Summen.

$(document).on('keyup change', '.quantity, .price', function() { 
    var row = $(this).closest('tr').get(0); 
    var rowPrice = $(row).find('.price').val(); 
    var rowQuantity = $(row).find('.quantity').val(); 

    $(row).find('.total').val((rowPrice * rowQuantity).toFixed(2)); 

    // Get all the totals from each row and convert them to 
    // an array of floats. Then sum them together with reduce 
    var totalPrice = $('.total').map(function (index, el) { 
     return parseFloat($(el).val()) || 0; 
    }).get().reduce(function (a,b) { return a + b }, 0) 

    // Update the total field with the calculated totals 
    $('#totals').val(totalPrice) 
}); 

https://jsfiddle.net/xqy6qafk/2/