La cuestión es que puedes introducir valores en los campos, y el resultado final se obtiene restando de 100
function findTotal() { var arr = document.getElementsByClassName('injection-dist'); var tot = document.getElementById('total').value; var sum = 0; for (var i = 0; i < arr.length; i++) { if (parseInt(arr[i].value)) { sum += parseInt(arr[i].value); } } final = tot - sum; document.getElementById('total').value = final; } Qty1 : <input onblur="findTotal()" type="text" class="injection-dist" name="qty[]" id="qty1" /><br> Qty2 : <input onblur="findTotal()" type="text" class="injection-dist" name="qty[]" id="qty2" /><br> Qty3 : <input onblur="findTotal()" type="text" class="injection-dist" name="qty[]" id="qty3" /><br> Qty4 : <input onblur="findTotal()" type="text" class="injection-dist" name="qty[]" id="qty4" /><br> <br><br> Total : <input type="text" name="total" id="total" value="100" />El código funciona, pero solo cuando se ingresa un solo valor. Al ingresar un segundo valor, se realiza un recálculo y el resultado es incorrecto
Por ejemplo, si ingresamos un valor de 1 en un campo, obtenemos 99, pero cuando ingresamos un valor posterior de 2 en otro campo, obtenemos 96 en lugar de 97...
Agradecemos cualquier ayuda
Eliminé la función que tenía, ya que obtenía el valor de todos los campos de entrada al mismo tiempo, y luego básicamente hacía total - SumOfAllInputs cada vez que cambiaba un valor.
En cambio, creé una lista de todas las entradas y agregué el evento de change para cada una de ellas, que obtiene el valor SOLAMENTE de la que está modificada actualmente, y luego hago total - thatValue .
var qty = document.querySelectorAll(".injection-dist"); //NodeList of all input fields qty.forEach(function(item){ //iterate trough the list item.addEventListener("change", function(){ // add change event for each of the elements (instead of onBlur) var value = item.value; //get value of the inserted value document.getElementById('total').value -= value;}); //change total value }) Qty1 : <input type="text" class="injection-dist" name="qty[]" id="qty1"/><br> Qty2 : <input type="text" class="injection-dist" name="qty[]" id="qty2"/><br> Qty3 : <input type="text" class="injection-dist" name="qty[]" id="qty3"/><br> Qty4 : <input type="text" class="injection-dist" name="qty[]" id="qty4"/><br> <br><br> Total : <input type="text" name="total" id="total" value="100" />