用javascript计算总计（onkeyup）

如何使用java脚本（onkeyup）计算总计总数？这是我的编码用javascript计算总计（onkeyup）

<html> 
    <head> 
     <form method = "POST" action="text.php" name="form"> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
     <link rel="stylesheet" href="css/jquery-ui.css"/> 
     <script src="js/jquery-1.9.1.js"></script> 
     <script src="js/jquery-ui.js"></script> 
     <!--<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>--> 
     <script type="text/javascript"> 

     function cal1() { 
     var a = $(".qty1").val(); 
     var b = $(".price1").val(); 
     c1 = a * b; //a * b 
     $(".total1").val(c1); 
     } 

     function cal2() { 
     var a = $(".qty2").val(); 
     var b = $(".price2").val(); 
     c2 = a * b; //a * b 
     $(".total2").val(c2); 
     } 

     function grandtotal() { 
     var a = $(".total1").val(); 
     var b = $(".total2").val(); 
     z = a+b; //+ 
     $(".grandtotal").val(z); 
     } 
     </script> 

    </head> 
    <body> 


<table border="1"> 
        <tr> 
         <td> 
          <table height="51" border="0" cellspacing="2"> 
           <tr> 
            <td> 
             <div align="center">Price</div> 
            </td> 
            <td> 
             <div align="center"> Total Price</div> 
            </td> 
           </tr> 
           <tr> 

            <td> 
             <input class="qty1" type="text" name="qty1" onblur="qty_blur(this);" onkeyup="cal1();" value=""> 
            </td> 
            <td> 
             <input class="price1" type="text" name="price1" onblur="price_blur(this);" onkeyup="cal1();" value=""> 
            </td> 
            <td> 
             <input class="total1" type="text" name="total1" value="0" readonly=true onkeyup="grandtotal();"> 
            </td> 
           </tr> 
           <tr> 
            <td> 
             <input class="qty2" type="text" name="qty2" onblur="qty_blur(this);" onkeyup="cal2();" value=""> 
            </td> 
            <td> 
             <input class="price2" type="text" name="price2" onblur="price_blur(this);" onkeyup="cal2();" value=""> 
            </td> 
            <td> 
             <input class="total2" type="text" name="total2" value="0" readonly=true onkeyup="grandtotal();"> 
            </td> 
           </tr> 
          </table> 
         </td> 
        </tr> 
       </table> 
       <table> 
        <tr div class="grandtotal"> 
         <td> 
          Grand Total : 
         </td> 
         <td> 
          <input class="grandtotal" name="grandtotal" type="text" readonly=true value=""> 
         </td> 
        </tr> 
        </div> 
       </table> 
    </body> 
</html>

它是CAL1和CAL2已经是正确的，但总计保持空当CAL和CAL2已经计算？如何总计自动计算+ ???形成总CAL1和总CAL2

来源

2014-10-11 Vilthering

使用'parseInt（）'或'parseFloat（）'将输入字段中的文本值解析为数字值。（So：'var a = parseInt（$（“。total1”）。val（））;'） – myfunkyside 2014-10-11 16:27:39

并且我建议你在'c1'，'c2'和'z'之前也使用'var'？（否则它们会被当作全局变量） – myfunkyside 2014-10-11 16:31:14

Thx对于你的评论，你这样介意吗？ var a = parseInt（$（“。qty1”）。val（））; \t \t \t var b = parseInt（$（“。price1”）。val（））; \t \t \t var c1 = parseInt（a）+ parseInt（b）; \t \t \t $（“。total1”）。val（c1）; – Vilthering 2014-10-11 16:43:57

你相关的grandtotal到onkeyup总计投入。但这些投入永远不会收到onkeyup，因为它们是readonly。

作为一个快速的解决方案，我建议只是要求从cal1和cal2grandtotal：

function cal1() { 
     var a = $(".qty1").val(); 
     var b = $(".price1").val(); 
     c1 = a * b; //a * b 
     $(".total1").val(c1); 
     grandtotal(); 
    } 

    function cal2() { 
     var a = $(".qty2").val(); 
     var b = $(".price2").val(); 
     c2 = a * b; //a * b 
     $(".total2").val(c2); 
     grandtotal(); 
    }

而且，@myfunkyside建议，你必须正确地解析输入数字。否则，您会将总计连接为字符串。

function grandtotal() { 
     var a = parseInt($(".total1").val(), 10); 
     var b = parseInt($(".total2").val(), 10); 
     z = a+b; //+ 
     $(".grandtotal").val(z); 
    }

来源

2014-10-11 16:36:42 dreyescat

Thx for ur comment :) – Vilthering 2014-10-11 17:02:22

用javascript计算总计（onkeyup）

回答

相关问题