jQuery'de bir sayıya virgül ekleyin


83

Bu numaralar bende var

10999ve 8094ve456

Ve tek yapmak istediğim, gerekirse doğru yere virgül eklemek, böylece şöyle görünür

10,999ve 8,094ve456

Bunların hepsi bunun gibi bir ap etiketi içinde <p class="points">10999</p>.

Yapılabilir mi?

Burada başka yayınların yardımıyla http://jsfiddle.net/pdWTU/1/ denedim ama işe yarayamıyor

Teşekkürler

Jamie

GÜNCELLEME

Biraz uğraştım ve burada çözmeyi başardı http://jsfiddle.net/W5jwY/1/

Bunu yapmanın daha iyi bir yolu için yeni Küreselleşme eklentisine bakacak

Teşekkürler

Jamie



3
Kemanınız için +1. Çözümünüzü güncellemenize dahil etmelisiniz:<number string>.replace(/\B(?=(?:\d{3})+(?!\d))/g, ',')
zhon

2
Keşke çözümünüz için +100 yapabilseydim: Kelime sınırı değil diyen Regex, ardından muhtemelen bir rakam gelmeyecek şekilde tekrarlanan 3 rakamdan önce pozitif bir bakış. Harika!
zhon

Bu çözüm çoğunlukla en iyisiydi, ancak benim için pek işe yaramadı. Maalesef 4 ve bazen 5 ondalık basamaklı sayıları göstermem gerekiyor. Çalıştığım insanlar, yüksek işlem sayısıyla ve bir kuruşun kesirleriyle uğraşıyorlar, 100 $ veya 1000 $ lira ekliyor (Ofis Alanını düşünün). 3'ü geçen ondalık basamakları işleyebilmesi için kemanınıza biraz kod yapıştırdım: http://jsfiddle.net/W5jwY/554/
Josh Bilderback

Bu sorunun gerçek cevabı burada: stackoverflow.com/a/2632502/1860982
Tosin Onikute

Yanıtlar:


138

Tüm tarayıcılarda çalışır, ihtiyacınız olan tek şey bu.

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

Düzenli ifade sayesinde bunu kompakt ve isabetli olarak yazdı. Bu düz JS'dir, ancak jQuery'nizde şu şekilde kullanabilirsiniz:

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

veya

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

4
user1655655'in cevabı çok daha iyi
Pyrolistical

7
Bu yanıtla ilgili iki sorun: 1. İşlevi aynı değerle birden çok kez çağırmak yanlış yerlerde virgülle sonuçlanacaktır (örneğin, keyup olayları). 2. Bu işlev, ondalık sayıları doğru şekilde işlemez ve ondalık sayıların arasına virgül ekler. Her ikisini de düzelten değiştirilmiş bir sürüm için bu JSFiddle'a bakın .
baacke

1
@baacke Bu işlevin fikri zayıf olmaktır, bu yüzden aynı değişken veya ondalık sayılar üzerinde iki kez çağırmayı hesaba katmadım (soruda olmadığı için). Her iki durumda da, keman örneğiniz ondalık sayıya ihtiyaç duyacağınız durumlar için kullanışlıdır, bu yüzden teşekkür ederim.
Timothy Perez

Virgül veya noktanın göründüğü yer yerel ayara göre belirlenir. JS standart kitaplığı bunu sizin için zaten yapabilir. developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
Alex Harvey

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

6
Bu en basit çözüm ve benim için mükemmel çalışıyor. Teşekkür ederim!
ahgood

3
bu ipucu için teşekkürler, özel işlevler yazmaktan veya bir eklenti eklemekten çok daha iyi. benim için 1 numaralı cevap!
linqu

5
Bu harika ve çoğu masaüstü tarayıcıda çalışıyor, ancak şu anda mobil tarayıcılarda sınırlı desteğine dikkat edin ... developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
Luke

2
Bunu Node.js ile kullanmak isteyenler için, v8 motorunu i18n'yi içerecek şekilde yeniden derlemediğiniz sürece çalışmayacaktır: stackoverflow.com/questions/23571043/…
Tom Spencer

3
Bu, tarayıcılar arasında tutarsızdır ve iPad'de hiç çalışmaz.
Isaac Askew

3

Timothy Pirez cevabı çok doğruydu, ancak sayıları virgülle değiştirmeniz gerekiyorsa, metin alanına kullanıcı yazarken, hemen Keyup işlevini kullanmak isteyebilirsiniz.

      $('#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

Https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString adresinde toLocaleString ref kullanma

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

başka bir yaklaşım:

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);

Başka bir harika eklenti: http://www.teamdf.com/web/jquery-number-format/178/


-1

Bunu yapmanın başka bir yolu:

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

@Timothy Perez'e yapılan bir yorumda sağlanan @ baacke'nin kemanının kahvehane versiyonu.

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
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.