2015-05-29 3 views
-1

Я хотел бы, чтобы умножить свои поля ввода, как в этом примере: http://jsfiddle.net/nnnnnn/5FpWC/множительной поля ввода с типом = «число»

$(document).ready(function() { 
    $(".txtMult input").keyup(multInputs); 

    function multInputs() { 
     var mult = 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 $total = ($val1 * 1) * ($val2 * 1) 
      $('.multTotal',this).text($total); 
      mult += $total; 
     }); 
     $("#grandTotal").text(mult); 
    } }); 

<tr class="txtMult"> 
     <td> 
      <input name="txtEmmail" class="val1" /> 
     </td> 
     <td> 
      <input name="txtEmmail" class="val2"/> 
     </td> 
     <td> 
       <span class="multTotal">0.00</span> 
     </td> 
    </tr> 

Моя проблема теперь, что мне нужно одно поле ввода как тип = «число» со значением по умолчанию = «1». Но когда я меняю тип на число, вычисление больше не работает. Вы знаете причину?

спасибо!

ответ

0

Я нашел решение!

$(function(){ 
      $('.in input').change(function(){ 
       var p=$(this).parent().parent() 
       var m=p.find('input.txtMult') 
       var mul=parseFloat($(m[0]).val()*$(m[1]).val()).toFixed(2) 
       var res=p.find('.multTotal') 
       res.html(mul); 
       var total=0; 
       $('.in .multTotal').each(function(){ 
        total+=parseFloat($(this).html()) 
       }) 
       $('.in #grandTotal').html(parseFloat(total).toFixed(2)) 
      }); 
     }) 

table class='in'> 
     <tr> 
      <td> 
       <input value="0" class ="txtMult" type="number" name="txtEmmail" /> 
      </td> 
      <td> 
       <input value="0" class ="txtMult" name="txtEmmail"/> 
      </td> 
      <td> 
       <span class="multTotal">0.00</span> 
      </td> 
     </tr> 
     <tr> 
      <td> 
       <input value="0" class ="txtMult" name="txtEmmail"/> 
      </td> 
      <td> 
       <input value="0" class ="txtMult" name="txtEmmail"/> 
      </td> 
      <td> 
       <span class="multTotal">0.00</span> 
      </td> 
     </tr> 
     <tr> 
      <td colspan="3" align="right"> 
       Grand Total# <span id="grandTotal">0.00</span> 
      </td> 
     </tr> 
    </table>