Question

我是Jquery的新编程，当jquery函数弹出时，我的网页出现问题。

如果您想进行任何测试www.nutrinet.hol.es/index6.php

，这是我的网页

选择任何产品后，“Unidad Maxima”和“Unidad minima”列会发生变化。

但是当选择其他产品时（例如第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));

   }

}）;

任何评论都会非常苛刻。谢谢！

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));

}

下次我建议你使用一个名为knockout的非常好的javascript插件，它可以做到这一点非常简单。

您可以在此fiddle

中查看结果

希望它有所帮助。

Jquery函数不会更新所有列

1 个答案: