Question

如何使用java脚本（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

Answer 1

您已将grandtotal与onkeyup总计输入相关联。但是这些输入永远不会收到onkeyup，因为它们是readonly。

作为一种快速解决方案，我建议您从grandtotal和cal1致电cal2：

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

使用javascript计算总计（onkeyup）

1 个答案: