jQuery의 숫자에 쉼표 추가


82

이 번호가 있습니다

109998094456

그리고 내가하고 싶은 것은 필요한 경우 올바른 위치에 쉼표를 추가하는 것뿐입니다.

10,9998,094456

이것들은 모두 이와 같은 ap 태그 내에 있습니다 <p class="points">10999</p>.

할 수 있습니까?

나는 다른 게시물 http://jsfiddle.net/pdWTU/1/ 의 도움으로 여기에서 시도했지만 작동하지 않는 것 같습니다.

감사

제이미

최신 정보

약간 혼란스러워서 여기 http://jsfiddle.net/W5jwY/1/

더 나은 방법을 위해 새로운 Globalization 플러그인을 살펴 보겠습니다.

감사

제이미



3
바이올린에 +1. 업데이트에 솔루션을 포함해야합니다.<number string>.replace(/\B(?=(?:\d{3})+(?!\d))/g, ',')
zhon

2
나는 당신의 해결책을 위해 +100을 할 수 있기를 바랍니다 : 정규식은 단어 경계가 아닌 3 자리 앞의 긍정적 인 표정을 말하며 숫자가 반복되지 않을 가능성이 있습니다. 대박!
zhon

이 솔루션은 대부분 최고 였지만 저에게는 효과적이지 않았습니다. 불행히도 4 자리, 때로는 5 자리 숫자를 표시해야합니다. 내가 일하는 사람들은 많은 거래를 처리하고 1 페니의 일부를 합하면 100 달러 또는 1000 달러가됩니다 (Office Space를 생각해보십시오). 난 그냥 3 과거 소수점을 처리 할 수 있도록 당신의 바이올린에 대한 몇 가지 코드를 때렸다 : http://jsfiddle.net/W5jwY/554/
조쉬 Bilderback

이 질문에 대한 실제 답변 : stackoverflow.com/a/2632502/1860982
Tosin Onikute

답변:


138

모든 브라우저에서 작동하며 이것이 필요한 전부입니다.

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

정규식 덕분에 간결하고 요점을 썼습니다. 이것은 직선 JS이지만 다음과 같이 jQuery에서 사용할 수 있습니다.

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

또는

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

4
user1655655의 대답은 더 나은 방법입니다
Pyrolistical

10
나는 거북이를 좋아한다!
Timothy Perez

7
이 대답에 대한 두 가지 문제 : 1. 동일한 값으로 함수를 두 번 이상 호출하면 잘못된 위치에 쉼표가 표시됩니다 (예 : keyup 이벤트). 2.이 함수는 소수를 제대로 처리하지 못하며 소수 안에 쉼표를 추가합니다. 두 가지를 모두 수정하는 수정 된 버전 은이 JSFiddle 을 참조하십시오 .
baacke

1
@baacke이 함수의 아이디어는 슬림하다는 것이므로 동일한 var 또는 decimals에서 두 번 호출하는 것을 고려하지 않았습니다 (질문에 포함되지 않았기 때문에). 어느 쪽이든, 귀하의 바이올린 예제는 소수가 필요한 경우에 유용하므로 감사합니다.
Timothy Perez

쉼표 또는 마침표가 나타나는 위치는 로케일에 따라 결정됩니다. JS 표준 라이브러리는 이미이 작업을 수행 할 수 있습니다. developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
Alex Harvey

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

6
이것은 가장 간단한 솔루션이며 저에게 완벽하게 작동합니다. 감사합니다!
ahgood 2013 년

3
그 힌트를 주셔서 감사합니다. 커스텀 함수를 작성하거나 플러그인을 포함하는 것보다 훨씬 낫습니다. 나를 위해 대답 # 1!
linqu

5
이것은 훌륭하고 대부분의 데스크톱 브라우저에서 작동하지만 현재 모바일 브라우저에서는 제한적으로 지원됩니다. developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
Luke

2
Node.js와 함께 이것을 사용하려는 사람은 i18n을 포함하도록 v8 엔진을 다시 컴파일하지 않는 한 작동하지 않습니다. stackoverflow.com/questions/23571043/…
Tom Spencer

3
이것은 브라우저에서 일관되지 않으며 iPad에서는 전혀 작동하지 않습니다.
Isaac Askew 2015 년

3

Timothy Pirez 대답은 매우 정확했지만 사용자가 텍스트 필드에 입력 할 때 즉시 숫자를 쉼표로 바꿔야하는 경우 키업 기능을 사용할 수 있습니다.

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

또 다른 접근 방식 :

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

또 다른 놀라운 플러그인 : http://www.teamdf.com/web/jquery-number-format/178/


-1

이를 수행하는 또 다른 방법 :

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에 대한 의견에 제공된 @baacke의 바이올린의 coffeescript 버전입니다.

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
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.