[英]Simple way to format a number in jQuery
I'm trying to work with jQuery's slider plugin and it works great, only I need to format the output into a readable number, with commas such as 30,402,424 as opposed to 30402424. 我正在尝试使用jQuery的滑块插件,它的效果很好,只需要将输出格式设置为可读的数字即可,例如30,402,424,而不是30402424。
I know it's possible with javascript but the only ways I've found are very long winded. 我知道使用javascript是可能的,但是我发现的唯一方法是漫长的。 I've created a fiddle so you can see what I mean... 我制造了一个小提琴,所以您可以明白我的意思了...
Javascript itself does not have support for formatting the numbers as you need, but with some googling I found the following familiar solution that I have used in the past, somewhat revised for better code quality. Javascript本身不支持按需要设置数字格式,但是通过进行一些谷歌搜索,我发现了以下我过去使用的熟悉的解决方案,为了更好的代码质量对其进行了一些修改。
function addCommas(numberString) {
numberString += '';
var x = numberString.split('.'),
x1 = x[0],
x2 = x.length > 1 ? '.' + x[1] : '',
rgxp = /(\d+)(\d{3})/;
while (rgxp.test(x1)) {
x1 = x1.replace(rgxp, '$1' + ',' + '$2');
}
return x1 + x2;
}
Source: http://www.mredkj.com/javascript/numberFormat.html 来源: http : //www.mredkj.com/javascript/numberFormat.html
Updated fiddle: http://jsfiddle.net/EX5U7/8/ 更新的小提琴: http : //jsfiddle.net/EX5U7/8/
Here's another solution, which implements PHP's number_format
function in Javascript, allowing you to do even more than just blatantly add commas every 3 numbers: 这是另一个解决方案,该解决方案在Javascript中实现了PHP的number_format
函数,使您不仅可以公然每三个数字添加逗号,还可以做更多的事情:
function number_format (number, decimals, dec_point, thousands_sep) {
number = (number + '').replace(/[^0-9+\-Ee.]/g, '');
var n = !isFinite(+number) ? 0 : +number,
prec = !isFinite(+decimals) ? 0 : Math.abs(decimals),
sep = (typeof thousands_sep === 'undefined') ? ',' : thousands_sep,
dec = (typeof dec_point === 'undefined') ? '.' : dec_point,
s = '',
toFixedFix = function (n, prec) {
var k = Math.pow(10, prec);
return '' + Math.round(n * k) / k;
};
// Fix for IE parseFloat(0.55).toFixed(0) = 0;
s = (prec ? toFixedFix(n, prec) : '' + 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);
}
Usage: number_format(123456.789, 2, '.', ',');
用法: number_format(123456.789, 2, '.', ',');
results in 123,456.79
结果123,456.79
Source: http://phpjs.org/functions/number_format:481 资料来源: http : //phpjs.org/functions/number_format : 481
Fiddle: http://jsfiddle.net/EX5U7/10/ 小提琴: http : //jsfiddle.net/EX5U7/10/
Use the following addCommas method : 使用以下addCommas方法:
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;
}
Working example : http://jsfiddle.net/EX5U7/1/ 工作示例: http : //jsfiddle.net/EX5U7/1/
consider using accounting.js. 考虑使用accounting.js。 It is a tiny JavaScript library for number, money and currency formatting 它是一个很小的JavaScript库,用于数字,货币和货币格式
http://josscrowcroft.github.com/accounting.js/ http://josscrowcroft.github.com/accounting.js/
使用正则表达式。
ui.value = (ui.value).toString().split("").reverse().join("").replace(/(\d{3})(?=\d)/g,"$1,").split("").reverse("").join("")
This is a duplicate. 这是重复项。
But for your information, the solution provided in This Question allowed me to edit your JSFiddle 但为您提供信息, 此问题中提供的解决方案使我可以编辑您的JSFiddle
$(function() {
$( "#slider" ).slider({
value:100,
min: 0,
max: 5000000000,
step: 1,
slide: function( event, ui ) {
$( "#amount" ).val( "£" + addCommas(ui.value) );
}
});
$( "#amount" ).val( "£" + addCommas($( "#slider" ).slider( "value" )));
});
function addCommas(nStr) {
nStr += '';
var x = nStr.split('.');
var x1 = x[0];
var x2 = x.length > 1 ? '.' + x[1] : '';
var rgx = /(\d+)(\d{3})/;
while (rgx.test(x1)) {
x1 = x1.replace(rgx, '$1' + ',' + '$2');
}
return x1 + x2;
}
try this: 尝试这个:
function formatNumber(n){
n += '';
x = n.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;
}
don't remember from where I got this but have used it here: https://github.com/amantur/jquery.ui.counter 不记得我从哪里得到的,但已经在这里使用过: https : //github.com/amantur/jquery.ui.counter
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.