如何使用jQuery使用带逗号的动画增加数字？

我试图在页面上的元素中增加一个数字。但是我需要这个数字包含一个逗号作为第千位值。（例如45000而非45000）

//从x到y设置元素值的动画：
$（{someValue:40000}）。动画（{someValue:45000}）{
时长：3000，
放松：'swing'，//可以是任何东西
步骤：对每个步骤调用函数（）{//
//使用四舍五入值更新元素的文本：
$（'#el'）.text（Math.round（this.someValue））；
}
});

---

如何使用带逗号的动画增加数字？

工作演示

可以根据您的需要对其进行更多更改，您也可以查看货币格式化程序，希望它能满足您的需要

：）

代码

// Animate the element's value from x to y:
  var $el = $("#el"); //[make sure this is a unique variable name]
  $({someValue: 40000}).animate({someValue: 45000}, {
      duration: 3000,
      easing:'swing', // can be anything
      step: function() { // called on every step
          // Update the element's text with rounded-up value:
          $el.text(commaSeparateNumber(Math.round(this.someValue)));
      }
  });

 function commaSeparateNumber(val){
    while (/(\d+)(\d{3})/.test(val.toString())){
      val = val.toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,");
    }
    return val;
  }

**输出*

---

您还应添加一个完整的功能，例如：

step:function(){
    //..
},
complete:function(){
    $el.text(commaSeparateNumber(Math.round(this.someValue)));
}

---

更新的Fiddle:

看看这个，我会将数字存储在数据属性中，然后在元素中显示该数字的逗号格式版本。当您增加它时，只需增加数据版本并替换格式化版本。这可能会对您有所帮助-知道为什么数字不一样吗？我正在围绕输出进行循环。你好@AdrianFlorescu，嗯，你是什么意思，对不起，不知道你在问什么<代码>：）您的意思是为什么输出没有显示，例如：44444？像这样：@Tats_不完全正确，但看起来这是因为动画步骤。我将“完成”上的值替换为原始值。complete:function（）{where.text（endNr）；}您还应该添加这样一个完整的函数：step:function（）{/..}，complete:function（）{$el.text（commaSeparateNumber（Math.round（this.someValue））；}为什么？我非常确定，即使在最后一个动画步骤中，

步骤

函数也会被调用。

complete

函数用于附加一个回调函数，以便在所有步骤完成后运行。有时它没有显示好的最后结果，最后是随机的，有时是45000，有时是4995等等，所以我添加了这个函数，现在它工作得很好。谢谢

step:function(){
    //..
},
complete:function(){
    $el.text(commaSeparateNumber(Math.round(this.someValue)));
}