JQuery 数字格式

IT技术 javascript jquery number-formatting
2021-02-19 07:58:37

关于这个基本功能的问题和答案太多了,我只见树木不见森林。

在 Java 中只有一个简单的答案(java.text.NumberFormat及其子类),所以我相信大多数插件、问题和答案最终都会成熟为 JQuery 的事实上的标准。

这个插件是我目前找到的最好的,但我不知道它是否还在开发中,是否成熟等等。

http://plugins.jquery.com/project/numberformatter

有更好的解决方案吗?是否成熟/活跃可以依赖?


编辑:

我希望能够基于 Java 使用的相同格式模式格式化货币、小数、整数,以便可以格式化客户端接收的数据,而无需先将其发送到服务器。

例如

格式1000$1,0001,000.00等(语言环境支持很好)

似乎http://plugins.jquery.com/project/numberformatter 可以完成这项工作,但问题是:“我使用的是正确的东西吗?” 或者“有没有更好的方法来做到这一点?”

6个回答

我建议查看这篇关于如何使用javascript处理基本格式的文章:

function addCommas(nStr)
{
    nStr += '';
    x = nStr.split('.');
    x1 = x[0];
    x2 = x.length > 1 ? '.' + x[1] : '';
    var rgx = /(\d+)(\d{3})/;
    while (rgx.test(x1)) {
        x1 = x1.replace(rgx, '$1' + ',' + '$2');
    }
    return x1 + x2;
}

来源:http : //www.mredkj.com/javascript/numberFormat.html

虽然 jQuery 可以以一百万种不同的方式让您的生活更轻松,但我认为这太过分了。请记住,jQuery 可能相当大,当您在页面上使用它时,您的用户浏览器需要下载它。

在使用 jQuery 时,您应该退后一步并询问它是否足以证明下载库的额外开销是合理的。

如果您需要某种高级格式(例如您链接的插件中的本地化内容),或者您已经包含 jQuery,那么可能值得查看 jQuery 插件。

旁注 -如果您想对 jQuery 的过度使用发笑,请查看此内容。

我用这段代码制作了一个 jQuery 插件。现在可以轻松地应用于页面中的多个位置:$('.number').formatNumber();默认是将 1343034.09 变成 1,343,034.09 - github.com/RaphaelDDL/jquery.formatNumber
2021-04-16 07:58:37
旧答案,但开箱即用,只需复制和粘贴,太棒了!!!
2021-04-24 07:58:37
Abe,您提供的链接非常有用。也许您可以编辑您的答案并在此处添加主要功能,以防它消失?你已经得到了适当的信任。
2021-04-29 07:58:37
不错的主意@PerryTew - 添加
2021-05-12 07:58:37

使用jQuery Number Format插件,您可以通过以下三种方式之一获取格式化的数字:

// Return as a string
$.number( 1234.5678, 2 ); // Returns '1,234.57'

// Place formatted number directly in an element:
$('#mynum').number( 1234.5678 ); // #mynum would then contain '1,235'

// Replace existing number values in any element
$('span.num').number( true, 2 ); // Formats and replaces existing numbers in those elements.

如果您不喜欢这种格式,或者您需要本地化,还有其他参数可让您选择如何格式化数字:

.nu​​mber( theNumber、decimalPlaces、decimalSeparator、千位分隔符)

您还可以从 GitHub获取jQuery 数字格式

我用了一段时间这个插件,它不可用。当您键入时,您会看到如何延迟格式化值。光标跳转,因此如果您输入字段并且其中有 0,则您选择它并开始输入 220 个光标跳转,然后您会得到 202 等等。如果您想做专业页面,这真的很糟糕。
2021-04-16 07:58:37
在 Stack Overflow 上包含对文档齐全的源的外部引用是值得赞赏的,但重要的是在您的答案中包含来自外部源的最重要/相关的片段,并提供有关如何回答问题的上下文。
2021-05-04 07:58:37

浏览器开发进展:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString

 Number.toLocaleString(locale);

 // E.g.
 parseFloat("1234567.891").toLocaleString(window.document.documentElement.lang);
 "1,234,567.891"
这不适用于西班牙语言环境和数量 < 10,000
2021-04-16 07:58:37
对我有用:parseFloat("1234.891").toLocaleString('es-ES');输出"1234,891"它看起来是正确的,因为es-ES. 如果您需要“.” 然后使用ca-ES确实有它的语言环境。
2021-05-03 07:58:37
这就是我所说的。千位分隔符不适用于西班牙语语言环境中小于 10,000 的数字,但没关系,我创建了一个只有一行代码的 jquery 扩展方法,以便用千位分隔符格式化整数,而无需担心设置特定的文化。
2021-05-14 07:58:37

Abe Miessler addCommas 函数的基础上编写了一个 PHP 函数number_format的 JavaScript 模拟可能有用。

number_format = function (number, decimals, dec_point, thousands_sep) {
        number = number.toFixed(decimals);

        var nstr = number.toString();
        nstr += '';
        x = nstr.split('.');
        x1 = x[0];
        x2 = x.length > 1 ? dec_point + x[1] : '';
        var rgx = /(\d+)(\d{3})/;

        while (rgx.test(x1))
            x1 = x1.replace(rgx, '$1' + thousands_sep + '$2');

        return x1 + x2;
    }

例如:

var some_number = number_format(42661.55556, 2, ',', ' '); //gives 42 661,56

如果您需要处理多种货币、各种数字格式等,我可以推荐autoNumeric很好用。已经成功使用它好几年了。