时间戳

首页 > 解决方案 > 总和显示 NaN 或 0

javascript - 总和显示 NaN 或 0

问题描述

在对输入值求和的过程中，总是显示整体NaN或O（下面的求和函数）。我无法总结价值。所有值都是数字，它们的变量也Number根据控制台信息。我使用的所有地方parseInt和Number方法。sum 函数也与parseInt方法一起使用。我不得不||在 sum up 函数中添加逻辑运算符，之后它总是出现0。 

 // points declaration for  rate determenation
     $(function () {
      $("#name_vehicle").change(function () { 

       var vehicle_value = $(this).val(),
        vehicle_point = $("#vehicle_point").val();

         vehicle_point = ( vehicle_value == "1" ) ? 1 :
                        ( vehicle_value == "2" ) ? 1 : 
                              ( vehicle_value == "3" ) ? 1 : 
                                     ( vehicle_value == "4" ) ? 1 : 
                                            ( vehicle_value == "5" ) ? 1: 
                                                (vehicle_value == "6" ) ? 2 : 0;


          $("#vehicle_point").val( vehicle_point );
     console.log ( vehicle_point );
        
      });// end change
                   
     }); // end ready
     
      $(function () {

        $("#term").change(function () { 

         var tv = $(this).val();
           var tp = $("#term_point").val();

          tp = ( tv == "1") ? 24:
                ( tv == "2") ? 36 :
                  ( tv == "3") ? 48:
                    ( tv == "4") ? 60 : 0;

              $("#term_point").val( tp );
              console.log ( tp );
                                                          
             }); // end change
                            
       }); // end ready
       
       
       $(function () {
             $("input").change(function () { 

          var cp = parseInt($("input[name=carPrice").val());
           var d = parseInt($("input[name=deposit").val());
           var ae = parseInt($("input[name=add_equip").val());
             var c = parseInt ($("input[name=casco]").val());
               var tp = parseInt($("input[name=term_point").val());

             var result = ( ( cp + ae ) - d + c );
              var pd =  ((d / ( cp + ae )) * 100); // DEPOSIT IN %

              $("#overall").val( result );
                                console.log ( result );

             $("#p_deposit").val( pd );
                                console.log ( pd );
                                console.log ( typeof pd );
                                  

        var cl_points = parseInt($("input[name=cl_points").val());
          var bl_points = parseInt($("input[name=bl_points").val());

                                if ( pd >= 20 && pd < 39.99 ) {
                                    cl_points =  1;
                                    bl_points =  1;
                                }
                                else if ( pd > 39.99 && pd < 49.99) {
                                    cl_points =  1;
                                    bl_points =  5;
                                }
                                else if ( pd > 49.99 && pd <= 55 ) {
                                    cl_points =  1;
                                    bl_points =  5;
                                }
                                else if ( pd > 55 && pd < 99.99 ) {
                                    cl_points =  1;
                                    bl_points =  0; 
                                }

                                $("#cl_points").val( cl_points );
                                $("#bl_points").val( bl_points );

                                console.log ( cl_points );
                                console.log ( bl_points );
                               
                            }); // end change
                            
                        }); // end ready
               
             $(function () {

            var sum = 0;

              $(".points").each(function () {

                   sum += parseInt($(this).val()) || 0;

                      $("#overallPoints").val( sum ) ;       
                                    console.log (sum);
                                    console.log ( typeof sum);
                                    
                                }); // end each
                                
                            }); // end ready   
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

<!-- first header-->
<div class="image-container">
  <div class="text"></div>
</div>
<br>

<div class="container-fluid">


  <div class="row">

    <div class="col-lg-4">
      <!-- box one-->

      <i class="fa fa-car" id="v1" style="font-size:84px;color:white"><span class="w1">А</span></i>

      <form>
        <div class="form-group">
          <label class="l1" for="name_vehicle">В</label>
          <select multiple class="form-control" id="name_vehicle">
            <option value="1">A</option>
            <option value="2">T</option>
            <option value="3">Q</option>
            <option value="4">X</option>
            <option value="5">M</option>
            <option value="6">J</option>
          </select>
          <input type="text" class="points" id="vehicle_point" style="display:none">
          <!-- POINT ONE-->
        </div>
      </form>

      <form>
        <div class="form-group">
          <label class="l1" for="carPrice">С:</label>
          <input type="text" class="form-control" id="carPrice" name="carPrice" value="0">
        </div>
        <div class="form-group">
          <label class="l1" for="add_equip">о:</label>
          <input type="text" class="form-control" id="add_equip" name="add_equip" value="0">
        </div>
      </form>
    </div>

    <div class="col-lg-4">
      <!-- box two-->

      <i class="fa fa-money" style="font-size:84px;color:white"><span class="w1">К</span></i>

      <form>
        <div class="form-group">
          <label class="l1" for="deposit">П</label>
          <input type="text" class="form-control" id="deposit" name="deposit" value="0">
          <input type="text" id="car_loan" style="display:none" name="car_loan">
          <!-- CAR LOAN SUM-->
        </div>

        <div class="form-group">
          <label class="l1" for="term">С</label>
          <select multiple class="form-control" id="term">
            <option value="1">24 </option>
            <option value="2">36 </option>
            <option value="3">48 </option>
            <option value="4">60 </option>
          </select>
          <input type="text" class="points" id="term_point" style="display:none" name="term_point">
          <!-- POINT TWO-->

        </div>

        <div class="form-group">
          <label class="l1" for="casco">К:</label>
          <input type="text" class="form-control" id="casco" name="casco" value="0">
          <input type="text" id="overall" style="display:none" name="overall">
          <!--SUM UP-->
          <input type="text" id="p_deposit" style="display:none">
          <!-- DEPOSIT IN %-->
          <input type="text" class="points" id="p_deposit_point" style="display:none" name="p_deposit_point">
          <!-- POINT THREE-->

        </div>
    </div>
  </div>

标签： javascriptjquery

解决方案

首先，当您有一个数字时，您不必使用 Number() 来确保它是一个数字。

这里的逻辑是错误的：

(tv == "1") ? tp = Number(24): Number(0);
(tv == "2") ? tp = Number(36): Number(0);
(tv == "3") ? tp = Number(48): Number(0);
(tv == "4") ? tp = Number(60): Number(0);

您不能在这里使用三元运算符。当您说 tv=2 时，第一个将其设置为零，第二个将其设置为 36，第三个将其设置回 0。

三元运算符必须如下所示：

(tv == "1") ? tp = Number(24): 
  (tv == "2") ? tp = Number(36):
    (tv == "3") ? tp = Number(48): 
      (tv == "4") ? tp = Number(60): Number(0);

但这真的没有什么意义。

你最好使用 if/else if 的 switch 语句

switch (tv) {
  case "1": tp = 24; break;
  case "2": tp = 36; break;
  case "3": tp = 48; break;
  case "4": tp = 60; break;
  case default: tp = 0; break;
}

同样的事情也适用于车辆点。

推荐阅读