총계 계산 오류

Question

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
    <style> 
    .trans_gc 
    { 
    width: 220px; 
height: 26px; 
    } 
    </style> 
<script> 
    $.noConflict(); 
    $(document).ready(function(){ 
     $(".trans_gc").each(function() { 

      $(this).keyup(function(){ 
       calculateSum(); 
      }); 
     }); 

    }); 

    function calculateSum() { 

     var sum = 0; 
     $(".trans_gc").each(function() { 

      if(!isNaN(this.value) && this.value.length!=0) { 
       sum += parseFloat(this.value); 
      } 

     }); 
     $("#trans_gc_total").html(sum); 
    } 
</script> 

    <div class="control-group"> 
     <div style="float: left;"> 

     <label class="control-label" > 
      FRT 
     </label> 
     <div class="controls" id="trans_gc_frt"> 
      <input type="text" class="trans_gc " name="trans_gc_frt" id="trans_gc_frt" required="required" > 
     </div> 
     </div> 
     <div> 
     <div> 

      <label class="control-label" style="margin-right: 20px;"> 
      Hamali Ch. 
      </label> 
      <div class="controls" > 
      <input type="text" class="trans_gc" name="trans_gc_hamali" id="trans_gc" required="required" > 
      </div> 
     </div> 

     </div> 

    </div> 

    <div class="control-group"> 
     <div style="float: left;"> 

     <label class="control-label" > 
      Sr.Ch 
     </label> 
     <div class="controls"> 
      <input type="text" class="trans_gc" name="trans_gc_sr" id="trans_gc" required="required" > 
     </div> 
     </div> 
     <div> 
     <div> 

      <label class="control-label" style="margin-right: 20px;"> 
      AOC 
      </label> 
      <div class="controls" > 
      <input type="text" class="trans_gc" name="trans_gc_aoc" id="trans_gc" required="required" > 
      </div> 
     </div> 

     </div> 

    </div> 

    <div class="control-group"> 
     <div style="float: left;"> 

     <label class="control-label" > 
      Door Cln 
     </label> 
     <div class="controls"> 
      <input type="text" class="trans_gc" name="trans_gc_doorcln" id="trans_gc" required="required"> 
     </div> 
     </div> 
     <div> 
     <div> 

      <label class="control-label" style="margin-right: 20px;"> 
      Door Del 
      </label> 
      <div class="controls" > 
      <input type="text" class="trans_gc" name="trans_gc_doordel" id="trans_gc" required="required" > 
      </div> 
     </div> 

     </div> 

    </div> 

    <div class="control-group"> 
     <div style="float: left;"> 

     <label class="control-label" > 
      Risk Ch 
     </label> 
     <div class="controls"> 
      <input type="text" class="trans_gc" name="trans_gc_riskch" id="trans_gc" required="required"> 
     </div> 
     </div> 
     <div> 
     <div> 

      <label class="control-label" style="margin-right: 20px;"> 
      Demmurage 
      </label> 
      <div class="controls" > 
      <input type="text" class="trans_gc" name="trans_gc_dem" id="trans_gc" required="required"> 
      </div> 
     </div> 

     </div> 

    </div> 

    <div class="control-group"> 

     <label class="control-label" > 
     Total Value 
     </label> 
     <div class="controls" > 
     <input type="text" class="span3" id="trans_gc_total" required="required"> 

     </div> 

     <!-- /controls --> 

    </div> 

총 금액이 id trans_gc_total의 입력 필드에 표시되지 않습니다. trans_gc 클래스를 가지는 모든 입력 필드의 합계를 원합니다. 누구든지이 문제를 해결할 수 있도록 도와주십시오.

여기

Answer 1

하는 노력 스크립트 주셔서 감사합니다 :

$(document).ready(function(){ 
    $(".trans_gc").keyup(calculateSum); 
}); 

function calculateSum() { 
    var sum = 0; 
    $(".trans_gc").each(function() { 
     if(!isNaN(this.value) && this.value.length!=0) { 
      sum += parseFloat(this.value); 
     } 
    }); 
    $("#trans_gc_total").val(sum); 
} 

보기 jsFiddle

제안

에서> 당신은 바인딩 이벤트에 대한 each를 실행할 필요가 없습니다

$(".trans_gc").each(function() { 
     $(this).keyup(function(){ 
      calculateSum(); 
     }); 
    }); 

> JQuery와에서 input 필드 값을 변경하려면이 .val() 대신 .html()

변경,

$("#trans_gc_total").html(sum); 

으로,

$("#trans_gc_total").val(sum); 

를 사용할 필요가로 :

이 단순화 될 수있다