如何制作自动求和计算输入字段

时间:2014-08-27 08:24:25

标签: javascript jquery

请查看此http://jsfiddle.net/F2wEK/4/

HTML

cost 1 :<input type="text" class="cost" name="cost1" /><br />
cost 2 :<input type="text" class="cost" name="cost2" /><br />
cost 3 :<input type="text" class="cost" name="cost3" /><br />
cost 4 :<input type="text" class="cost" name="cost4" /><br /><br />
sum : <input type="text" id="sum" readonly />

的Javascript

$(document).ready(function(){
    $(".cost").each(
        function(){
        $(this).keyup(
            function(){
            calculateSum()
                });
            });
        });

        function calculateSum(){
            var sum=0;
            $(".cost").each(
            function(){
                var vl = this.value.replace(',','');
                if(!isNaN(vl) && vl.length!=0){
                    sum+=parseFloat(vl);
                    }
                }); 

            $("#sum").val(sum.toFixed(2));
            }

$(document).ready(function(){
  $('input.cost').keyup(function(event){
      // skip for arrow keys
      if(event.which >= 37 && event.which <= 40){
          event.preventDefault();
      }
      var $this = $(this);
      var num = $this.val().replace(/,/gi, "").split("").reverse().join("");

      var num2 = RemoveRougeChar(num.replace(/(.{3})/g,"$1,").split("").reverse().join(""));

      console.log(num2);


      // the following line has been simplified. Revision history contains original.
      $this.val(num2);
  });
});

function RemoveRougeChar(convertString){


    if(convertString.substring(0,1) == ","){

        return convertString.substring(1, convertString.length)            

    }
    return convertString;

}

如果我输入100000,1000000,10000000,更大......为什么它不能自动求和?如何让它与千千万亿的数字一起工作?请帮帮我们..

2 个答案:

答案 0 :(得分:2)

问题是你的替换功能,它只替换第一个','而不是全部。在calculateSum()功能中执行此操作:

var vl = this.value.replace(',', '');

我建议

var vl = this.value.split(',').join('');

代替。或者','使用RegExp,例如:

var myExp = /,/g;
var vl = this.value.replace(myExp, '');

试试fiddle它对我来说很好。

答案 1 :(得分:1)

更改替换功能。它仅替换第一次出现的逗号:

var vl = this.value.replace(/,/g, '');