jQuery 千位分隔符 - JavaScript

在进行数字格式化时，为了方便人类阅读，经常需要采用千位分隔符。本文将介绍如何使用 jQuery 和 JavaScript 在数字中添加千位分隔符。

方法一：使用 toLocaleString()

JavaScript 提供了内置方法 toLocaleString()，可以直接在数字上使用，它会将数字转化为字符串，并在数字中添加千位分隔符。例如：

const num = 1000000;
const str = num.toLocaleString(); // '1,000,000'

但是这个方法可能因为浏览器或操作系统的区域和语言设置的不同，而导致默认千位分隔符类型不同。

方法二：手动添加千位分隔符

为了解决上面的问题，我们可以手动添加千位分隔符。下面是一个简单的 JavaScript 函数，可以在数字中添加千位分隔符：

function addCommas(num) {
  const str = num.toString();
  const parts = str.split('.');
  parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ',');
  return parts.join('.');
}

const num = 1000000;
const str = addCommas(num); // '1,000,000'

该函数将数字以字符串的形式传入，使用正则表达式 \B(?=(\d{3})+(?!\d)) 匹配每三位数字并添加逗号。最终返回一个带有千位分隔符的字符串。需要注意的是，该函数并没有考虑多个小数点的情况。

方法三：jQuery 插件

如果你正在使用 jQuery，可以考虑使用一个 jQuery 插件，例如 jQuery Number，它能够更简便地添加千位分隔符。首先需要在 HTML 中引入必要的 css 和 js 文件：

<link rel="stylesheet" href="jquery.number.css"/>
<script src="jquery.js"></script>
<script src="jquery.number.min.js"></script>

然后在 JavaScript 中直接使用 $.number() 方法：

const num = 1000000;
const str = $.number(num, 0, '.', ','); // '1,000,000'

其中，第一个参数为要格式化的数字，第二个参数为小数点的位数，第三个参数为小数点的分隔符，第四个参数为千位分隔符。该方法也支持其他格式化类型，例如货币格式化、时间格式化等。

总结

以上介绍了三种在 JavaScript 中添加千位分隔符的方法。 toLocaleString() 方法是最简单的方法，但可能受到不同浏览器或操作系统的影响，而手动添加千位分隔符和 jQuery 插件则具有更高的灵活性。