使用千位分隔符和保留两位小数格式化数字

Question

我正在使用jquery将一个div填充数据，但需要以千位分隔符形式格式化输出，并保留两位小数，同时保持输出为数字。

注意：我当前正在使用以下方式填充div：

var prev_count = 120;
var new_count = 20.50;

    var count_till = prev_count < new_count ? new_count : new_count - 1;
    jQuery({ Counter: prev_count }).animate({ Counter: count_till }, {
        duration: 600,
        easing: 'swing',
        step: function () {
            jQuery("#count_div").text(Math.ceil(this.Counter));
        }
    });

起始变量为120，旨在倒数到20.50，但最终结果为20而非20.50，是否可能？如果可能，如何解决？

这是我的jsfiddle。

- user1419810

---

Rory McCrossan，这与钱无关！？ - user1419810

你使用的是哪个插件？ - Justinas

使用数字格式化库。当已经有解决你问题的经过验证的代码免费提供时，编写自己的数字格式化代码只是浪费大家的时间。 - Tomalak

或者，选择任何一个解决您当前问题的方案并使用它。我不明白为什么要由我来做出推荐，毕竟您比我更了解自己的需求。这也是为什么在这里提供推荐不被认可的主要原因之一。另一个原因是，推荐本质上是主观的，并且很快就会过时。相关的元帖子是这个，而不是您引用的那个（即使那个也说他们是OT）。 - Tomalak

让我们在聊天中继续这次讨论。点击此处进入聊天室。 - user1419810

Answer 1

Math.Ceil 返回大于等于给定数字的最小整数。 整数没有小数部分（这就是您要找的内容）

您需要将输出数字的行替换为此行：

jQuery("#count_div").html(this.Counter.toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, '$1,'));

这里有一个可用的JSFiddle链接: https://jsfiddle.net/12g2pj4L/2/

- zerohero

---

但我总是希望答案保留2位小数，如果以20.5作为目标，这样是否只能达到一位小数？ - user1419810

Answer 2

好的，我已经使用一个函数解决了这个问题，它可以添加千位分隔符并使用toFixed(2)设置小数点，代码如下：

$.fn.digits = function(){ 
    return this.each(function(){ 
        $(this).text( $(this).text().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,") ); 
    })
}

var prev_count = "1125";
prev_count = prev_count.split(',').join('');
prev_count = parseInt(prev_count);

var new_count = 1320.50;

var count_till = prev_count < new_count ? new_count : new_count;
jQuery({ Counter: prev_count }).animate({ Counter: count_till }, {
    duration: 7000,
    easing: 'swing',
    step: function () {
    jQuery("#count_div").html(this.Counter.toFixed(2)).digits();

    }
});

并且在这里玩弄它

- user1419810

---

为什么要使用 var count_till = prev_count < new_count ? new_count : new_count;？这相当于普通的非条件赋值 var count_till = new_count。 - ProfK