2012-12-12 98 views
1

我需要使用Javascript來添加和減去。我已成功添加所有輸入字段,但無法從第一個字段中減去總數。我已經在下面插入了一個示例,而您將以1500的餘額開始,然後插入讓我們來說說您有3個字段的業務成本。如上所述,我可以成功地將所有字段加起來,但不能從天平中減去總量並在右下方顯示。用Javascript添加和減去輸入值

添加腳本

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
<script type="text/javascript"> 
    $(function(){   
     $('input').each(function() { 
      $(this).keyup(function(){ 
       calculateTotal($(this)); 
      }); 
     }); 
    }); 

    function calculateTotal(src) { 
     var sum = 0; 
     var sumtable = src.closest('.sumtable'); 

     sumtable.find('input').each(function() { 
      if(!isNaN(this.value) && this.value.length!=0) { 
       sum += parseFloat(this.value); 
      } 
     }); 

     sumtable.find(".total").html(sum.toFixed(2)); 
    } 
</script> 

HTML

<tr> 
    <td> 
    <font face='Verdana'> 
    <input name='amount' size='6' value='1500.00'></font></td> 
</tr> 
<table border='0' cellpadding='0' cellspacing='0' width='16%' height='31' class='sumtable'> 
<tr> 

    <font face='Verdana' style='font-size: 8pt; font-weight:700'> 
    Amount:</font></td> 
</tr> 
<tr> 
    <td> 
    <font face='Verdana'> 
    <input name='amount' size='6' ></font></td> 
</tr> 
<tr> 
    <td> 
    <font face='Verdana'> 
    <input name='amount' size='6' ></font></td> 
</tr> 
<tr> 
    <td> 
    <font face='Verdana'> 
    <input name='select3_amount' size='6' ></font></td> 
</tr> 
<tr> 
<td>&nbsp;</td> 
</tr> 
<tr> 
<td> 
<p align='right'><b> 
<font face='Verdana' size='2'>Total Cost: $ 
</font></b> </td> 
       <td><b><font face='Verdana' size='2'><span class='total'>0</span></font></b></td> 
</tr> 
<tr> 
<td> 
<p align='right'><b> 
<font face='Verdana' size='2'>Total Remaining: $ 
</font></b> </td> 
<td><b><font face='Verdana' size='2'><span class='balance'>0</span></font></b></td> 
</tr> 
</table> 

什麼我需要添加到顯示的餘額?

+2

只是一個小提示,你可以直接使用KEYUP,'$( '輸入')。KEYUP(回調)'你不需要'each' 。 – Cybrix

+0

你想從哪裏減去它? – Blender

回答

1

這是你想到的:http://jsfiddle.net/ZZX5D/

var bal = $('input[name="amount"]').val(); 
bal = bal - sum 
sumtable.find(".balance").html(bal.toFixed(2)); 
+0

是的!非常感謝你! – Zowes

0

你並沒有減去第一個值。

$(function(){   
     $('input').each(function() { 
      $(this).keyup(function(){ 
       calculateTotal($(this)); 
      }); 
     }); 
    }); 

    function calculateTotal(src) { 
     var sum = 0; 
     var sumtable = src.closest('.sumtable'); 

     sumtable.find('input').each(function() { 
      if(!isNaN(this.value) && this.value.length!=0) { 
       sum += parseFloat(this.value); 
      } 
     }); 

     sumtable.find(".total").html(sum.toFixed(2)); 
     var balance = parseFloat($('.actual').val()) - sum 
     sumtable.find(".balance").html(balance.toFixed(2)); 
    } 

    Added a `class actual` to the **Actual Amount** 

Check fiddle