Comment formater les nombres en utilisant un séparateur de virgule tous les trois chiffres à l'aide de jQuery ?
Par exemple :
Input Output
298 298
2984 2,984
297312984 297,312,984@Paul Creasey avait la solution la plus simple comme le regex, mais la voici comme un simple plugin jQuery :
$.fn.digits = function(){
return this.each(function(){
$(this).text( $(this).text().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,") );
})
}Vous pourriez alors l'utiliser comme ceci :
$("span.numbers").digits();
Fonctionne parfaitement ! Merci à Paul Creasey pour un code simple et élégant et merci à Doug Neiner pour l'avoir mis au format plugin. Crédit accordé aux deux.
RC @Mark Byers La syntaxe est correcte. '999.9999'.replace(/( \d )(?=( \d\d\d )+( ?! \d ))/g, "$1,") renvoie cependant '999.9,999'.
@bendewey l'OP n'a pas mis à jour sa question, mais il a ajouté ce commentaire "nombres positifs uniquement, pas de fractions, pas de décimales, pas de monnaie impliquée, et format standard américain" que la réponse de @Paul Creasey a fourni.
Vous pouvez essayer NumberFormatter .
$(this).format({format:"#,###.00", locale:"us"});Il prend également en charge différentes langues, dont bien sûr les États-Unis.
Voici un exemple très simplifié de son utilisation :
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.numberformatter.js"></script>
<script>
$(document).ready(function() {
$(".numbers").each(function() {
$(this).format({format:"#,###", locale:"us"});
});
});
</script>
</head>
<body>
<div class="numbers">1000</div>
<div class="numbers">2000000</div>
</body>
</html>Sortie :
1,000
2,000,000
J'ai jeté un coup d'œil à ce plugin et d'après la description de l'auteur, il est destiné à être utilisé dans les champs de saisie des formulaires. Comment puis-je l'adopter pour l'appliquer à <span class="numbers">2984</span> afin qu'il formate en <span class="numbers">2,984</span> sans les décimales. J'ai essayé $('span.numbers').format({format : "#,###", locale : "us"}) ; mais rien ne s'est passé. Je suis toujours en train d'examiner le plugin et de jouer avec. Désolé, je suis un novice en matière de jQuery :-)
+1 Super de connaître ce plugin. Je suis d'accord que pour la croissance et l'internationalisation future, ce serait la meilleure voie à suivre.
Ce n'est pas jQuery, mais cela fonctionne pour moi. Tiré de ce site .
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;
}
"Je ne pense pas que les autres approches fantaisistes auraient fonctionné dans ma situation, où les données sont intégrées dans un Canvas (Chart.JS). Mais l'ajout de cette fonction et son appel dans l'événement afterDraw() du graphique fonctionnent parfaitement : ctx.fillText(addCommas(dataset.data[i]),
L'élément central est le replace appel. Jusqu'à présent, je pense qu'aucune des solutions proposées ne traite tous les cas suivants :
1000 => '1,000'
'1000' => '1,000'
10000.00 => '10,000.00'
'01000.00 => '1,000.00'
'1000.00000' => '1,000.00000'
- o + : '-1000.0000' => '-1,000.000'
'1000k' => '1000k'
La fonction suivante fait tout ce qui précède.
addCommas = function(input){
// If the regex doesn't match, `replace` returns the string unmodified
return (input.toString()).replace(
// Each parentheses group (or 'capture') in this regex becomes an argument
// to the function; in this case, every argument after 'match'
/^([-+]?)(0?)(\d+)(.?)(\d+)$/g, function(match, sign, zeros, before, decimal, after) {
// Less obtrusive than adding 'reverse' method on all strings
var reverseString = function(string) { return string.split('').reverse().join(''); };
// Insert commas every three characters from the right
var insertCommas = function(string) {
// Reverse, because it's easier to do things from the left
var reversed = reverseString(string);
// Add commas every three characters
var reversedWithCommas = reversed.match(/.{1,3}/g).join(',');
// Reverse again (back to normal)
return reverseString(reversedWithCommas);
};
// If there was no decimal, the last capture grabs the final digit, so
// we have to put it back together with the 'before' substring
return sign + (decimal ? insertCommas(before) + decimal + after : insertCommas(before + after));
}
);
};Vous pourriez l'utiliser dans un plugin jQuery comme celui-ci :
$.fn.addCommas = function() {
$(this).each(function(){
$(this).text(addCommas($(this).text()));
});
}; Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.
0 votes
Je suis novice en matière de jQuery et j'aimerais disposer d'une fonction/plugin simple qui ajoute simplement une virgule après tous les trois chiffres si les numéros ont plus de trois chiffres. Il s'agit uniquement de nombres positifs, pas de fractions, pas de décimales, pas de devises, et le format standard américain (1 111) et non (1 111 ou 1 111,11). Je préférerais que ce soit fait en utilisant jQuery et pas seulement javascript si possible et ce serait bien que le code soit défini dans une fonction pour qu'il puisse être appliqué très facilement. Comment dois-je m'y prendre ? J'apprécie les commentaires de chacun. Merci encore.
2 votes
@inconnu : Vous avez déjà de nombreuses réponses. Regardez les réponses que vous avez reçues et évaluez-les pour voir laquelle vous convient le mieux. Si vous avez besoin de plus de précisions sur l'une des réponses, postez-les en commentaire de cette réponse.
1 votes
Désolé, ma question n'était pas assez concise mais voyez le format du plugin de Doug Neiner utilisant le code de Paul Creasey pour la réponse.