简体   繁体   English

用JavaScript计算总计(onkeyup)

[英]Calculate the grand total with javascript (onkeyup)

How calculate grand total from total using java script (onkeyup)? 如何使用Java脚本(onkeyup)从总计中计算总计? This my coding 这是我的编码

    <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>

it's already correct for cal1 and cal2, but grand total keep empty when cal and cal2 already calculate?? 它已经对cal1和cal2正确了,但是当cal和cal2已经计算出来时,总计保持为空? how to grand total auto calculate +??? 如何总计自动计算+ ??? form total cal1 and total cal2 形成total cal1和total cal2

You have associated the grandtotal to the onkeyup totals inputs. 您有相关的grandtotalonkeyup总计投入。 But those inputs will never receive an onkeyup because they are readonly . 但是这些输入将永远不会收到onkeyup因为它们是readonly

As a quick solution I suggest simply calling grandtotal from cal1 and cal2 : 作为一个快速的解决办法,我建议简单地调用grandtotalcal1cal2

    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();
    }

Also, as @myfunkyside suggest, you have to properly parse the inputs to numbers. 另外,正如@myfunkyside所建议的那样,您必须正确地将输入解析为数字。 Otherwise you'll get the totals concatenated as strings. 否则,您将把总计连接成字符串。

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

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM