添加空格的 JS 计数器

Question

我有这个代码：

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

和<span class="counter">15000</span>

我想把它和

结合起来

 num.toLocaleString() ;

例如显示 15 000 而不是 15000

我不是javascript方面的专家，所以我不知道该怎么做。有人可以帮忙吗？

Answer 1

您可以创建另一个辅助函数，它将数字作为输入并返回本地化字符串。然后你可以用它包装你的代码部分，它给你实际的数字（Math.ceil(now)）。阿拉伯语的两者组合（仅作为示例）如下所示：

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

function toArabic(x) {
    return x.toLocaleString('ar-EG');
}

startCounter();

要获取您的特定国家/地区代码，只需查找 "BCP 47 language tag"。希望我能帮上忙:)

Answer 2

好的，在 KofferDev 的帮助下，我成功了：

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

 function toArabic(x) {
     return x.toLocaleString('cs-CZ');
 }

和HTML部分相同：

<span class="counter">15000</span>

添加空格的 JS 计数器

JS counter with adding spaces

javascript

jquery

counting