додати коми до числа в jQuery


83

У мене є ці цифри

10999і 8094та456

І все, що я хочу зробити, це додати кому в потрібному місці, якщо це потрібно, щоб це виглядало так

10,999і 8,094та456

Всі вони знаходяться в тегу ap, як цей <p class="points">10999</p>тощо.

Чи можна це зробити?

Я спробував тут за допомогою інших публікацій http://jsfiddle.net/pdWTU/1/, але, здається, не можу змусити його працювати

Дякую

Джеймі

ОНОВЛЕННЯ

Трохи заплутався і зумів це зрозуміти тут http://jsfiddle.net/W5jwY/1/

Збираючись поглянути на новий плагін глобалізації для кращого способу зробити це

Дякую

Джеймі


4
Пов'язані питання тут: stackoverflow.com/questions/2901102 / ...
epascarello

3
+1 для вашої скрипки. Ви повинні включити своє рішення у своє оновлення:<number string>.replace(/\B(?=(?:\d{3})+(?!\d))/g, ',')
zhon

2
Я б хотів, щоб я міг +100 для вашого рішення: Regex вимовляє Без межі слова, за яким слідує позитивний вигляд перед 3 цифрами, можливо, повторюваними, а не цифрами. Чудово!
zhon

Це рішення було здебільшого найкращим, але для мене не зовсім спрацювало. На жаль, мені потрібно відображати цифри з 4, а іноді і 5 десяткових знаків. Люди, з якими я працюю, мають справу з великою кількістю транзакцій і часткою копійки, що складає до 100 або 1000 доларів (думаю, Office Space). Я просто ляснув кодом на вашу скрипку, щоб дозволити йому обробляти десяткові коми після 3: http://jsfiddle.net/W5jwY/554/
Джош Більдербек,

Реальний відповідь на це питання тут: 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 набагато краща
пірологічна

7
Дві проблеми з цією відповіддю: 1. Виклик функції більше одного разу з однаковим значенням призведе до коми в неправильних місцях (наприклад, події клавіатури). 2. Ця функція не обробляє десяткові знаки належним чином і буде додавати коми всередині десяткових знаків. Дивіться цей JSFiddle для зміненої версії, яка виправляє обидва.
baacke

1
@baacke Ідея цієї функції полягає в тому, щоб бути тонкою, тому я не враховував, що двічі викликав її на одній і тій же змінній або десяткових знаках (оскільки мова не йшла про це). У будь-якому випадку, ваш приклад скрипки корисний для випадків, коли вам знадобиться десятковий знак, тож дякую.
Тімоті Перес

Де з’являється кома чи крапка, визначається мовою. Стандартна бібліотека JS вже може це зробити за вас. developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
Alex Harvey

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

6
Це найпростіше рішення, і воно ідеально підходить для мене. Дякую!
ahgood

3
дякую за підказку, набагато кращу, ніж написання власних функцій або включення плагіна. для мене відповідь No1!
linqu

5
Це чудово і працює в більшості настільних браузерів, але будьте обережні, це обмежена підтримка в мобільних браузерах зараз ... developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
Лука

2
Для тих, хто хоче використовувати це з Node.js, це не буде працювати, якщо ви не перекомпілюєте движок v8 для включення i18n: stackoverflow.com/questions/23571043/…
Том Спенсер

3
Це несумісно в браузерах і взагалі не працює на iPad.
Isaac Askew

3

Відповідь Тимоті Піреза була дуже правильною, але якщо вам потрібно замінити цифри комами Відразу ж, як типи користувачів у текстовому полі, ви, можливо, захочете скористатися функцією Keyup.

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

Погляньте на Numeral.js . Він може форматувати цифри, валюту, відсотки та підтримує локалізацію.


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

Використання посилання toLocaleString на 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

інший підхід:

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

Ось моя версія сценарію скрипки @ baacke, надана в коментарі @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
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.