javascript - jQuery 数字计数器不接受逗号

Question

我目前正在创建一个数字计数器(从 0 到一个值)，如果用逗号分隔，我在获取要呈现的数字时遇到了一些麻烦。

我找到了一些潜在的修复方法，例如 toLocaleString，但我无法让它工作 - 谁能指出我正确的方向？

目前，当我使用 130,000 时，它返回 NaN。

谢谢!

$('.panel-text-style-c').each(function() {

  $(this).prop('Counter', 0).animate({
    Counter: $(this).text()
  }, {
    duration: 2000,
    easing: 'swing',
    step: function(now) {
      $(this).text(Math.ceil(now).toString());
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span class='panel-text-style-c'>130,000</span>

以上内容

Answer 1

在 JS 中，, 不能用于解析为整数的值。这就是您收到 NaN 输出的原因。

要解决此问题，请使用 replace() 在将逗号提供给 Counter 属性之前删除逗号:

$('.panel-text-style-c').each(function() {
  $(this).prop('Counter', 0).animate({
    Counter: $(this).text().replace(/,/g, '')
  }, {
    duration: 2000,
    easing: 'swing',
    step: function(now) {
      $(this).text(Math.ceil(now).toLocaleString());
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<span class='panel-text-style-c'>130,000</span>