jquery函數不會更新所有列

Question

我是jquery中的新編程，當jquery函數彈出時，我的網頁出現問題。

這是我的網頁上，如果你想要做的任何測試www.nutrinet.hol.es/index6.php

當任何產品的選擇中，列「團結報千里馬」和「團結報極小」的變化。

但是，當選擇其他產品（例如第3個）時，只有他們提到的行發生變化，下一行發生變化，其他行（第2和第1）仍未更新。

這是我的jquery函數。 Val3 ='Unidades elegidas'列字段。

$(document).ready(function() { 



    $(".txtMult input").keyup(multInputs); 

    function multInputs() { 

     var mult = 0; 
     var sum = 0; 
     var cantidadfinal = 0; 
     var preciofinal =0; 
     var cantidadesminimas = 0; 

       var cantidadesmaximas = 0; 


     // for each row: 
     $("tr.txtMult").each(function() { 


      // get the values from this row: 
      var $val1 = $('.val1', this).val(); 
      var $val2 = $('.val2', this).val(); 
      var $val3 = $('.val3', this).val(); 
      var $val4 = $('.val4', this).val(); 



      var $total = ($val1 * 1) * ($val2 * 1) 
      var $cantidadestotales = ($val3 * 1) * ($val2 * 1) 
      var $preciostotales = ($val4 * 1) * ($val2 * 1)   


      mult += $total; 

      cantidadfinal += $cantidadestotales; 

      preciofinal += $preciostotales; 

      sum += parseFloat($val2); 

      cantidadesminimas = (8260 - cantidadfinal)/$val3 

      cantidadesmaximas = (12390 - cantidadfinal)/$val3 


      $('.val5',this).html(cantidadesminimas.toFixed(0)); 

       $('.val6',this).html(cantidadesmaximas.toFixed(0)); 



     }); 

     $("#precio").html(preciofinal.toFixed(0)); 
     $("#cantidadelegida").html(cantidadfinal.toFixed(0)); 
     $("#sum").html(sum.toFixed(0)); 
     $("#grandTotal").html(mult.toFixed(0)); 
     $("#cantidadmin").html(8260-cantidadfinal.toFixed(0)); 
     $("#cantidadmax").html(12390-cantidadfinal.toFixed(0)); 
     $("#kcaltotal").html(14000-mult.toFixed(0)); 

    } 

}）;

任何評論將非常apreciated.Thanks！

Answer 1

好吧，明白了。事情是，變量cantidadesminimas和cantidadesmaximas取決於值cantidadfinal，我們不知道cantidadfinal的有效值，直到我們已經通過所有的行。這會導致錯誤：如果行x在行y之後，其cantidadfinal未考慮行y的值，因此保持不變。最快的解決方案是循環兩次：首先計算cantidadfinal，另一個循環在.val5和.val6中設置正確的值。

$(".txtMult input").keyup(multInputs); 
function multInputs() { 
    var mult = 0; 
    var sum = 0; 
    var cantidadfinal = 0; 
    var preciofinal = 0; 
    var cantidadesminimas = 0; 
    var cantidadesmaximas = 0; 

    // for each row: 
    $("tr.txtMult").each(function() { 
     // get the values from this row: 
     var $val1 = $('.val1', this).val(); 
     var $val2 = $('.val2', this).val(); 
     var $val3 = $('.val3', this).val(); 
     var $val4 = $('.val4', this).val(); 

     var $total = ($val1 * 1) * ($val2 * 1); 
     var $cantidadestotales = ($val3 * 1) * ($val2 * 1); 
     var $preciostotales = ($val4 * 1) * ($val2 * 1); 

     mult += $total; 
     cantidadfinal += $cantidadestotales; 
     preciofinal += $preciostotales; 
     sum += parseFloat($val2); 
    }); 

    // Now we have the correct cantidadfinal and can update the values properly 
    $("tr.txtMult").each(function() { 
     var $val3 = $('.val3', this).val(); 
     cantidadesminimas = (8260 - cantidadfinal)/$val3; 
     cantidadesmaximas = (12390 - cantidadfinal)/$val3; 

     $('.val5', this).html(cantidadesminimas.toFixed(0)); 
     $('.val6', this).html(cantidadesmaximas.toFixed(0)); 
    }); 

    $("#precio").html(preciofinal.toFixed(0)); 
    $("#cantidadelegida").html(cantidadfinal.toFixed(0)); 
    $("#sum").html(sum.toFixed(0)); 
    $("#grandTotal").html(mult.toFixed(0)); 
    $("#cantidadmin").html(8260 - cantidadfinal.toFixed(0)); 
    $("#cantidadmax").html(12390 - cantidadfinal.toFixed(0)); 
    $("#kcaltotal").html(14000 - mult.toFixed(0)); 

} 

對於下一次我建議你使用一個非常好的JavaScript插件叫做淘汰賽，它確實很好，很容易。

您可以在此fiddle

檢查結果希望它能幫助。