сумма чисел, не имеющих желаемого эффекта jquery

Question

Я относительно не знаком с javascript/jQuery, и у меня возникли проблемы с получением ожидаемого результата. Я хотел бы, чтобы общее количество отображалось, даже если только один вход имеет значение, в противном случае я хочу показать 0. Однако сейчас он требует ввода всех трех значений до того, как будет отображаться сумма. Он не будет просто добавлять следующий ввод в итоговое значение, когда я ввожу в ввод. Я могу представить себе ряд длинных условных операторов, которые будут перекрестно проверять каждый вход для .length и возвращать общее количество на основе каждого входа. Разумеется, должен быть более простой и понятный способ. Если бы это была java, я бы использовал total + = (переменная), и это бы их итог, когда я пошел. Кажется, здесь это не работает.

$('#invoice_labor, #invoice_materials, #invoice_other').keyup(function() { 
     if ($('#invoice_labor').length || $('#invoice_materials').length || $('#invoice_other').length) { 
      updateTotal();   
     } else { 
      $('#invoice_total').html(0); 
     } 
    });  
    var updateTotal = function() { 
     var input1 = parseFloat($('#invoice_labor').val(), 2); 
     var input2 = parseFloat($('#invoice_materials').val(), 2); 
     var input3 = parseFloat($('#invoice_other').val(), 2); 
     var total = input1 + input2 + input3;  
     $('#invoice_total').html(total); 
     $("#invoice_total").html(parseFloat($("#invoice_total").html()).toFixed(2));   
    }; 

и вот fiddle я возился с.

Таким образом, я хочу, чтобы общее значение изменялось независимо от того, в каком поле я ввожу число. Если это всего лишь одно, общее количество, которое добавляет это к общей переменной и возвращает ее. Если это комбинация из двух, объедините их и добавьте их в общую. Спасибо за помощь.

Answer 1

Попробуйте

$('#invoice_labor, #invoice_materials, #invoice_other').keyup(function() { 
    updateTotal();   
});  
var updateTotal = function() { 
    var input1 = parseFloat($('#invoice_labor').val()) || 0; 
    var input2 = parseFloat($('#invoice_materials').val()) || 0; 
    var input3 = parseFloat($('#invoice_other').val()) || 0; 
    var total = input1 + input2 + input3;  
    $("#invoice_total").html(total.toFixed(2));   
}; 

Демо: Fiddle

Ваша скрипка имеет несколько problesm

1. Вы регистрировали на вход KeyUp событие, в обработчике тело KeyUp которое было неправильно - это может привести к первое нажатие клавиши не должно быть распознано и будет запускать несколько повторных вызовов в последующих вызовах
2. Если поле пусто parseFloat возвратит NaN, который при добавлении приведет к NaN в результате
3. parseFloat принимает только один аргумент