Javascript计算器不减去后退按键

Question

 var total = 0; $(document).ready(function() { $('select').on('change', function() { alert(this.value); }); $(".amount").change(function() { var amount = $(".amount").val(); console.log(amount); total = total + parseInt(amount); console.log(total); $("#total").html(total); }); $(".penalty").change(function() { var penalty = $(".penalty").val(); console.log(penalty); total = total + parseInt(penalty); console.log(total); $("#total").html(total); }); }); $(document).on('keydown', function(event) { if (event.keyCode == 8) { // Prevent default (disable the back button behavior) /*event.preventDefault();*/ var amount = $(".amount").val(); console.log("amount is"); console.log(amount); total = total - parseInt(amount); console.log(total); $("#total").html(total); // Your code } });

 <head> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <select class="form-control col-md-6"> <option value="1">Customs</option> <option value="2">VAT</option> <option value="3">Excise</option> <option value="4">Others</option> </select> <!--div for customs!--> <div class="form-group row" id="forCustoms"> <label class="col-xs-3 col-form-label mr-2">Reason</label> <div class="col-xs-9"> <input type="text" class="form-control" id="reason" name="reason"> </div> <label class="col-xs-3 col-form-label mr-2">Amount</label> <div class="col-xs-9"> <input type="text" class="form-control amount" id="amount" name="amount"> </div> <label class="col-xs-3 col-form-label mr-2">Penalty</label> <div class="col-xs-9"> <input type="text" class="form-control penalty" id="penalty" name="penalty"> </div> </div> <!--div for customs! ends--> <div class="col-md-12"> Total : <p id="total"></p> </div> </div> </body>

Amount和Penalty是需要添加的两个输入字段。我设法将它们相加，加法的结果实现了，但是当我尝试减去它们时，它没有给我正确的结果。按键，但不能给我正确的减法结果。如何处理并带来正确的总数？

Answer 1

我不确定您对keydown处理程序的期望是什么...而且我也不知道<select> 。

但是关于您的评论：

我可以在输入字段中的每一个数字更改中进行总更改吗？

这是我使添加始终正确的方法：

 $(document).ready(function() { $(".amount, .penalty").change(function() { var total = 0; var amount = parseInt($(".amount").val()) || 0; console.log("amount: "+amount); var penalty = parseInt($(".penalty").val()) || 0; console.log("penalty: "+penalty); total = amount + penalty; console.log(total); $("#total").html(total); }); });

 <head> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <select class="form-control col-md-6"> <option value="1">Customs</option> <option value="2">VAT</option> <option value="3">Excise</option> <option value="4">Others</option> </select> <!--div for customs!--> <div class="form-group row" id="forCustoms"> <label class="col-xs-3 col-form-label mr-2">Reason</label> <div class="col-xs-9"> <input type="text" class="form-control" id="reason" name="reason"> </div> <label class="col-xs-3 col-form-label mr-2">Amount</label> <div class="col-xs-9"> <input type="text" class="form-control amount" id="amount" name="amount"> </div> <label class="col-xs-3 col-form-label mr-2">Penalty</label> <div class="col-xs-9"> <input type="text" class="form-control penalty" id="penalty" name="penalty"> </div> </div> <!--div for customs! ends--> <div class="col-md-12"> Total : <p id="total"></p> </div> </div> </body>

Javascript计算器不减去后退按键

问题描述

1 个解决方案

解决方案1
1 2019-02-23 17:30:04

Javascript计算器不减去后退按键

问题描述

1 个解决方案

解决方案1 1 2019-02-23 17:30:04

解决方案1
1 2019-02-23 17:30:04