Добавить разделитель тысяч в общую сумму с Javascript или jQuery?

Question

У меня есть функция, которая суммирует столбец данных в таблице html. Он делает это превосходно, только я хотел бы, чтобы он поставил там запятые, которые необходимы для разделения тысяч. Вначале вы заметите, что в добавленных числах есть запятые. Чтобы функция добавила их, они удаляются. Как добавить туда запятые?

<script type="text/javascript"> 
    function sumOfColumns(tableID, columnIndex, hasHeader) { 
     var tot = 0; 
     $("#" + tableID + " tr" + (hasHeader ? ":gt(0)" : "")) 
      .children("td:nth-child(" + columnIndex + ")") 
      .each(function() { 
       tot += parseInt($(this).html().replace(',', '')); 
      }); 
     return "Total Pounds Entered : " + tot; 
    } 
</script> 

Answer 1

$(this).html().replace(',', '') не должны фактически изменить страницу. Вы уверены, что запятые удаляются на странице?

Если это так, то addCommas function должен сделать трюк.

function addCommas(nStr) { 
    nStr += ''; 
    var x = nStr.split('.'); 
    var x1 = x[0]; 
    var x2 = x.length > 1 ? '.' + x[1] : ''; 
    var rgx = /(\d+)(\d{3})/; 
    while (rgx.test(x1)) { 
     x1 = x1.replace(rgx, '$1' + ',' + '$2'); 
    } 
    return x1 + x2; 
} 

Answer 2

Это добавит разделители тысяч, сохраняя при этом дробной части заданного числа:

function format(n, sep, decimals) { 
    sep = sep || "."; // Default to period as decimal separator 
    decimals = decimals || 2; // Default to 2 decimals 

    return n.toLocaleString().split(sep)[0] 
     + sep 
     + n.toFixed(decimals).split(sep)[1]; 
} 

format(4567354.677623); // 4,567,354.68 

Вы также можете зондировать для десятичного разделителя в локали с:

var sep = (0).toFixed(1)[1]; 

Answer 3

меня где-то по следующему методу:

var value = 123456789.9876543 // i.e. some decimal number 

var num2 = value.toString().split('.'); 
var thousands = num2[0].split('').reverse().join('').match(/.{1,3}/g).join(','); 
var decimals = (num2[1]) ? '.'+num2[1] : ''; 

var answer = thousands.split('').reverse().join('')+decimals; 

Использование split-reverse-join - это скрытый способ работы с обратной стороны строки на передней панели, по группам из 3. Возможно, это более простой способ сделать это, но он чувствовал себя интуитивно понятным.

Answer 4

Это, как я это делаю:

// 2056776401.50 = 2,056,776,401.50 
function humanizeNumber(n) { 
    n = n.toString() 
    while (true) { 
    var n2 = n.replace(/(\d)(\d{3})($|,|\.)/g, '$1,$2$3') 
    if (n == n2) break 
    n = n2 
    } 
    return n 
} 

Или в CoffeeScript:

# 2056776401.50 = 2,056,776,401.50 
humanizeNumber = (n) -> 
    n = n.toString() 
    while true 
    n2 = n.replace /(\d)(\d{3})($|,|\.)/g, '$1,$2$3' 
    if n == n2 then break else n = n2 
    n 

Answer 5

Рассмотрим это:

function group1k(s) { 
    return (""+s) 
     .replace(/(\d+)(\d{3})(\d{3})$/ ,"$1 $2 $3") 
     .replace(/(\d+)(\d{3})$/   ,"$1 $2" ) 
     .replace(/(\d+)(\d{3})(\d{3})\./ ,"$1 $2 $3.") 
     .replace(/(\d+)(\d{3})\./  ,"$1 $2." ) 
    ; 
} 

Это быстрое решение для чего под 999.999.999 , что обычно достаточно. Я знаю недостатки, и я не говорю, что это самое главное оружие, но оно так же быстро, как и другие, и я считаю это еще более удобочитаемым. Если вам не нужны десятичные знаки, вы можете упростить его еще больше:

function group1k(s) { 
    return (""+s) 
     .replace(/(\d+)(\d{3})(\d{3})$/ ,"$1 $2 $3") 
     .replace(/(\d+)(\d{3})$/  ,"$1 $2" ) 
    ; 
} 

Не удобно.

Answer 6

Использование toLocaleString()
В вашем случае сделать:

return "Total Pounds Entered : " + tot.toLocaleString(); 

Answer 7

рекурсивное решение:

function thousands(amount) { 
    if(/\d{3}\d+/.test(amount)) { 
    return thousands(amount.replace(/(\d{3}?)(,|$)/, ',$&')); 
    } 
    return amount; 
} 

другой раскол решение:

function thousands (amount) { 
    return amount.split('').reverse().join('').replace(/\d{3}/g, '$&,').split('').reverse().join(''); 
} 

Answer 8

Я знаю, что это убер прочитанное сообщение и имеет хорошие ответы, НО если кто-то заинтересован, то является плагином jQuery, который упрощает форматирование чисел (численное форматирование, количество знаков после запятой, пользовательский разделитель тысяч и т. д.), делая включение и простой вызов. Имеется множество функций и документации. Это называется jQuery Number.

Вы просто включить его:

<script type="text/javascript" src="jquery/jquery.number.min.js"></script> 

И затем использовать его:

На автоматического форматирования HTML ввода: $('input.number').number(true, 2);

или

На JS вызова: $.number(5020.2364, 2); // Outputs: 5,020.24

Надеюсь, это помогает кому-то.

Answer 9

Ниже рабочий пример:

$("#estimated-amount-due .content").html("$" + miniCartTotal.toFixed(2).replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,")); 

Эта линия достаточно, это работает для меня. Проверьте полный код ниже. Дайте мне знать, хорошо ли это для вас тоже.

$(".action.showcart").on('click', function() { 
    var miniCartTotal = $("#estimated-subtotal .price").html(); 
    var miniCartTotalString = miniCartTotal.replace(/\$/g, ''); 
    var miniCartTotalString = miniCartTotalString.replace(/,/g, ''); 
    var configValue = 5; 

    miniCartTotal = parseFloat(miniCartTotalString) + configValue; 
    console.log("updated value " + miniCartTotal); 

    $("#estimated-amount-due .content").html("$" + miniCartTotal.toFixed(2).replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,")); 
}); 

Answer 10

лучший и простой способ форматирования числа заключается в использовании функции Java-скрипт

var numberToformat = 1000000000 
//add locality here, eg: if you need English currency add 'en' and if you need Danish currency format then use 'da-DA'. 
var locality = 'en-EN'; 
numberToformat = numberToformat.toLocaleString(locality , { 
minimumFractionDigits: 4 }) 
document.write(numberToformat); 

для получения дополнительной информации нажмите documentation page