Fügen Sie einer Zahl in jQuery Kommas hinzu


82

Ich habe diese Nummern

10999und 8094und456

Und alles, was ich tun möchte, ist, an der richtigen Stelle ein Komma hinzuzufügen, wenn es benötigt wird, damit es so aussieht

10,999und 8,094und456

Diese befinden sich alle in einem solchen ap-Tag <p class="points">10999</p>usw.

Kann es gemacht werden?

Ich habe es hier mit Hilfe anderer Beiträge versucht: http://jsfiddle.net/pdWTU/1/, aber es scheint nicht zu funktionieren

Vielen Dank

Jamie

AKTUALISIEREN

Ein bisschen rumgespielt und es hier herausgefunden http://jsfiddle.net/W5jwY/1/

Schauen Sie sich das neue Globalisierungs-Plugin an, um eine bessere Möglichkeit zu finden

Vielen Dank

Jamie



3
+1 für deine Geige. Sie sollten Ihre Lösung in Ihr Update aufnehmen:<number string>.replace(/\B(?=(?:\d{3})+(?!\d))/g, ',')
zhon

2
Ich wünschte, ich könnte +100 für Ihre Lösung: Regex sagt Nicht Wortgrenze, gefolgt von einem positiven Blick vor 3 Ziffern, möglicherweise wiederholt, gefolgt von einer Ziffer. Genial!
Zhon

Diese Lösung war größtenteils die beste, hat aber bei mir nicht ganz funktioniert. Leider muss ich Zahlen mit 4 und manchmal 5 Dezimalstellen anzeigen. Die Leute, für die ich arbeite, beschäftigen sich mit hohen Transaktionszahlen und Bruchteilen eines Pennys und summieren sich auf 100 oder 1000 Dollar (denken Sie an Büroräume). Ich habe gerade einen Code auf Ihre Geige geschlagen, damit sie Dezimalstellen nach 3 verarbeiten kann: http://jsfiddle.net/W5jwY/554/
Josh Bilderback

Echte Antwort auf diese Frage hier: stackoverflow.com/a/2632502/1860982
Tosin Onikute

Antworten:


138

Funktioniert mit allen Browsern, das ist alles was Sie brauchen.

  function commaSeparateNumber(val){
    while (/(\d+)(\d{3})/.test(val.toString())){
      val = val.toString().replace(/(\d+)(\d{3})/, '$1'+','+'$2');
    }
    return val;
  }

Schrieb dies, um kompakt und auf den Punkt zu kommen, dank Regex. Dies ist Straight JS, aber Sie können es in Ihrer jQuery wie folgt verwenden:

$('#elementID').html(commaSeparateNumber(1234567890));

oder

$('#inputID').val(commaSeparateNumber(1234567890));

4
Die Antwort von user1655655 ist viel besser
Pyrolistical

10
Ich mag Schildkröten!
Timothy Perez

7
Zwei Probleme mit dieser Antwort: 1. Wenn Sie die Funktion mehrmals mit demselben Wert aufrufen, werden Kommas an den falschen Stellen angezeigt (z. B. Keyup-Ereignisse). 2. Diese Funktion verarbeitet Dezimalstellen nicht richtig und fügt Kommas innerhalb der Dezimalstellen hinzu. In dieser JSFiddle finden Sie eine modifizierte Version, die beide Probleme behebt.
Baacke

1
@baacke Die Idee dieser Funktion ist, schlank zu sein, daher habe ich nicht berücksichtigt, dass sie zweimal auf derselben Var oder denselben Dezimalstellen aufgerufen wurde (da dies nicht in Frage kam). In jedem Fall ist Ihr Geigenbeispiel nützlich für Fälle, in denen Sie eine Dezimalstelle benötigen würden. Vielen Dank.
Timothy Perez

Wo ein Komma oder ein Punkt erscheint, wird durch das Gebietsschema bestimmt. Die JS-Standardbibliothek kann dies bereits für Sie tun. developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
Alex Harvey

130
Number(10000).toLocaleString('en');  // "10,000"

6
Dies ist die einfachste Lösung und sie funktioniert perfekt für mich. Danke dir!
Ahgood

3
Vielen Dank für diesen Hinweis, viel besser als benutzerdefinierte Funktionen zu schreiben oder ein Plugin einzuschließen. für mich antworte # 1!
Linqu

5
Dies ist großartig und funktioniert in den meisten Desktop-Browsern. Beachten Sie jedoch, dass die Unterstützung in mobilen Browsern derzeit begrenzt ist ... developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
Luke

2
Für alle, die dies mit Node.js verwenden möchten, funktioniert es nur, wenn Sie die v8-Engine neu kompilieren, um i18n einzuschließen
Tom Spencer

3
Dies ist in allen Browsern inkonsistent und funktioniert auf dem iPad überhaupt nicht.
Isaac Askew

3

Die Antwort von Timothy Pirez war sehr korrekt, aber wenn Sie die Zahlen durch Kommas ersetzen müssen Sofort, wenn der Benutzer das Textfeld eingibt, möchten Sie möglicherweise die Keyup-Funktion verwenden.

      $('#textfield').live('keyup', function (event) {
        var value=$('#textfield').val();

      if(event.which >= 37 && event.which <= 40){
          event.preventDefault();
      }
      var newvalue=value.replace(/,/g, '');   
      var valuewithcomma=Number(newvalue).toLocaleString('en');   
      $('#textfield').val(valuewithcomma); 

      });

    <form><input type="text" id="textfield" ></form>



1
    function delimitNumbers(str) {
      return (str + "").replace(/\b(\d+)((\.\d+)*)\b/g, function(a, b, c) {
        return (b.charAt(0) > 0 && !(c || ".").lastIndexOf(".") ? b.replace(/(\d)(?=(\d{3})+$)/g, "$1,") : b) + c;
      });
    }

    alert(delimitNumbers(1234567890));


0

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

function formatComma(value, sep = 0) {
      return Number(value).toLocaleString("ja-JP", { style: "currency", currency: "JPY", minimumFractionDigits: sep });
    }
console.log(formatComma(123456789, 2)); // ¥123,456,789.00
console.log(formatComma(123456789, 0)); // ¥123,456,789
console.log(formatComma(1234, 0)); // ¥1,234


-1

Ein anderer Ansatz:

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;
}
var a  = addCommas(10000.00);
alert(a);

Ein weiteres erstaunliches Plugin: http://www.teamdf.com/web/jquery-number-format/178/


-1

Ein anderer Weg, es zu tun:

function addCommas(n){
  var s = "",
      r;

  while (n) {
    r = n % 1000;
    s = r + s;
    n = (n - r)/1000;
    s = (n ? "," : "") + s;
  }

  return s;
}

alert(addCommas(12345678));

-1

Hier ist meine Coffeescript-Version von @ baackes Geige in einem Kommentar zu @Timothy Perez

class Helpers
    @intComma: (number) ->
        # remove any existing commas
        comma = /,/g
        val = number.toString().replace comma, ''

        # separate the decimals
        valSplit = val.split '.'

        integer = valSplit[0].toString()
        expression = /(\d+)(\d{3})/
        while expression.test(integer)
            withComma = "$1,$2"
            integer = integer.toString().replace expression, withComma

        # recombine with decimals if any
        val = integer
        if valSplit.length == 2
            val = "#{val}.#{valSplit[1]}"

        return val
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.