JQuery数字格式

时间:2011-09-06 22:47:25

标签: javascript jquery number-formatting

关于这个基本功能有太多的问题和答案,我看不到树木的木材。

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

这个插件是我迄今为止发现的最好的插件,但我不知道它是否仍在开发中,是否成熟等。

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

有更好的解决方案吗?它是否足够成熟/活跃?


修改

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

e.g。

格式1000$1,0001,000.00等(区域设置支持很好)

似乎http://plugins.jquery.com/project/numberformatter完成了工作,但问题是:“我使用的是正确的吗?”或“有更好的方法吗?”

8 个答案:

答案 0 :(得分:65)

我建议您查看有关如何使用 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插件。

旁注 - check this out如果你想对过度使用jQuery感到轻笑。

答案 1 :(得分:18)

使用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.

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

.number(theNumber,decimalPlaces,decimalSeparator,thousandsSeparator)

您还可以获得jQuery Number Format from GitHub

答案 2 :(得分:4)

浏览器开发进度:

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"

答案 3 :(得分:3)

如果您需要处理多种货币,各种数字格式等,我可以推荐autoNumeric。工作一种享受。几年来一直成功使用它。

答案 4 :(得分:1)

将此http://www.mredkj.com/javascript/numberFormat.html$('.number').formatNumber();概念放在一起,您可以使用以下代码行;

e.g。 <td class="number">1172907.50</td>的格式将为<td class="number">1,172,907.50</td>

$('.number').text(function () { 
    var str = $(this).html() + ''; 
    x = str.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'); 
    } 
    $(this).html(x1 + x2); 
});

答案 5 :(得分:1)

http://jquerypriceformat.com/#examples

https://github.com/flaviosilveira/Jquery-Price-Format

html输入正在运行。

<input type="text" name="v7"  class="priceformat"/>
<input type="text" name="v8"  class="priceformat"/>


$('.priceformat').each(function( index ) {
    $(this).priceFormat({ prefix: '',  thousandsSeparator: '' });
});

// 5000.00

// 5.000,00

// 5,000.00

答案 6 :(得分:1)

我在 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

答案 7 :(得分:0)

http://locutus.io/php/strings/number_format/

module.exports = function number_format (number, decimals, decPoint, thousandsSep) { // eslint-disable-enter code hereline camelcase
  //  discuss at: http://locutus.io/php/number_format/
  // original by: Jonas Raoni Soares Silva (http://www.jsfromhell.com)
  // improved by: Kevin van Zonneveld (http://kvz.io)
  // improved by: davook
  // improved by: Brett Zamir (http://brett-zamir.me)
  // improved by: Brett Zamir (http://brett-zamir.me)
  // improved by: Theriault (https://github.com/Theriault)
  // improved by: Kevin van Zonneveld (http://kvz.io)
  // bugfixed by: Michael White (http://getsprink.com)
  // bugfixed by: Benjamin Lupton
  // bugfixed by: Allan Jensen (http://www.winternet.no)
  // bugfixed by: Howard Yeend
  // bugfixed by: Diogo Resende
  // bugfixed by: Rival
  // bugfixed by: Brett Zamir (http://brett-zamir.me)
  //  revised by: Jonas Raoni Soares Silva (http://www.jsfromhell.com)
  //  revised by: Luke Smith (http://lucassmith.name)
  //    input by: Kheang Hok Chin (http://www.distantia.ca/)
  //    input by: Jay Klehr
  //    input by: Amir Habibi (http://www.residence-mixte.com/)
  //    input by: Amirouche
  //   example 1: number_format(1234.56)
  //   returns 1: '1,235'
  //   example 2: number_format(1234.56, 2, ',', ' ')
  //   returns 2: '1 234,56'
  //   example 3: number_format(1234.5678, 2, '.', '')
  //   returns 3: '1234.57'
  //   example 4: number_format(67, 2, ',', '.')
  //   returns 4: '67,00'
  //   example 5: number_format(1000)
  //   returns 5: '1,000'
  //   example 6: number_format(67.311, 2)
  //   returns 6: '67.31'
  //   example 7: number_format(1000.55, 1)
  //   returns 7: '1,000.6'
  //   example 8: number_format(67000, 5, ',', '.')
  //   returns 8: '67.000,00000'
  //   example 9: number_format(0.9, 0)
  //   returns 9: '1'
  //  example 10: number_format('1.20', 2)
  //  returns 10: '1.20'
  //  example 11: number_format('1.20', 4)
  //  returns 11: '1.2000'
  //  example 12: number_format('1.2000', 3)
  //  returns 12: '1.200'
  //  example 13: number_format('1 000,50', 2, '.', ' ')
  //  returns 13: '100 050.00'
  //  example 14: number_format(1e-8, 8, '.', '')
  //  returns 14: '0.00000001'

  number = (number + '').replace(/[^0-9+\-Ee.]/g, '')
  var n = !isFinite(+number) ? 0 : +number
  var prec = !isFinite(+decimals) ? 0 : Math.abs(decimals)
  var sep = (typeof thousandsSep === 'undefined') ? ',' : thousandsSep
  var dec = (typeof decPoint === 'undefined') ? '.' : decPoint
  var s = ''

  var toFixedFix = function (n, prec) {
    if (('' + n).indexOf('e') === -1) {
      return +(Math.round(n + 'e+' + prec) + 'e-' + prec)
    } else {
      var arr = ('' + n).split('e')
      var sig = ''
      if (+arr[1] + prec > 0) {
        sig = '+'
      }
      return (+(Math.round(+arr[0] + 'e' + sig + (+arr[1] + prec)) + 'e-' + prec)).toFixed(prec)
    }
  }

  // @todo: for IE parseFloat(0.55).toFixed(0) = 0;
  s = (prec ? toFixedFix(n, prec).toString() : '' + Math.round(n)).split('.')
  if (s[0].length > 3) {
    s[0] = s[0].replace(/\B(?=(?:\d{3})+(?!\d))/g, sep)
  }
  if ((s[1] || '').length < prec) {
    s[1] = s[1] || ''
    s[1] += new Array(prec - s[1].length + 1).join('0')
  }

  return s.join(dec)
}