jQuery calculate sum of values in all text fields

Question

I have an order form with about 30 text fields that contain numerical values  I d like to calculate the sum of all those values on blur   I know how to select all text fields but not how to loop through them and add up all their values     document  ready function           price   blur function           loop and add up every value from     price   val

User · Accepted Answer

price   blur function          var sum   0          price   each function             sum    Number   this  val                     here  you have your sum

User · Answer

Use this function       price   each function    total price    parseInt   this  val

User · Answer

This should fix it   var total   0         price   each  function              total      this  val     1

User · Answer

This will work 100    lt script type  quot text javascript quot  gt      function calculate         var result   document getElementById  result        var el  i   0  total   0       while el   document getElementById  v   i               el value   el value replace    D   quot  quot          total   total   Number el value             result value   total      if document getElementById  v0   value    quot  quot   amp  amp        document getElementById  v1   value    quot  quot   amp  amp        document getElementById  v2   value    quot  quot              result value   quot  quot                      lt  script gt   Some number  lt input type  quot text quot  id   quot v0 quot  onkeyup  quot calculate   quot  gt  Some number  lt input type  quot text quot  id   quot v1 quot  onkeyup  quot calculate   quot  gt  Some number  lt input type  quot text quot  id   quot v2 quot  onkeyup  quot calculate   quot  gt  Result   lt input type  quot text quot  id  quot result quot  onkeyup  quot calculate   quot   readonly gt

User · Answer

price   blur function          var sum   0          price   each function              if   this  val                               sum    parseFloat   this  val                                 alert sum                  JS Fiddle

User · Answer

Similarly along the lines of these answers written as a plugin     fn sum   function          var sum   0      this each function              sum    1    this  val                 return sum       For the record 1   x is faster than Number x  in Chrome

User · Answer

price   each function     total price    parseFloat   this  val             please try like this

User · Answer

If you don t need to support IE8 then you can use the native Javascript Array prototype reduce   method  You will need to convert your JQuery object into an array first    var sum       price   toArray   reduce function sum element         if isNaN sum   sum   0       return sum   Number element value       0     Reference  https   developer mozilla org en-US docs Web JavaScript Reference Global Objects Array Reduce

User · Answer

A tad more generic copy paste function for your project   sumjq   function selector        var sum   0        selector  each function             sum    Number   this  text                 return sum     console log sumjq   price

[jquery] jQuery calculate sum of values in all text fields

Examples related to jquery