需要达到的效果,当多个输入框填写数字时,自动相加,总数实时显示到另一个input中,本文主要通过jQuery方式来实现,具体实现实现代码如下:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...
需要达到的效果,当多个输入框填写数字时,自动相加,总数实时显示到另一个input中,本文主要通过Jquery方式来实现,具体实现实现代码如下:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>多个input累计求和并动态显示到另一输入框</title> <script src="https://www.umtheme.com/zb_system/script/jQuery-2.2.4.min.js" type="text/javascript"></script> <script> $(function () { $('.inputBox .input').bind('input propertychange', function(){ var total = 0; $(".input").each(function(){ total+=(parseFloat($(this).val())?parseFloat($(this).val()):0); }); /*total=total.toFixed(1);保留小数点后一位,如果有小数点的情况,可以通过它控制小数点位数*/ $("#total").val(total); }); }); </script> </head> <body> <div class="inputBox"> <input type="text" class="input"> <input type="text" class="input"> <input type="text" class="input"> <input type="text" class="input"> <input type="text" class="input"> <input type="text" id="total" disabled> </div> </body> </html>