Как правильно форматировать валюту с помощью jquery?

Мне не нужна маска, но мне нужно что-то, что будет форматировать валюту(во всех браузерах) и не допускать ввода каких-либо букв или специальных символов. Спасибо за помощь

пример:

действует: 50.00$
1,000$.53

недопустимо: $w45.00
$34.3r6

9 ответов


ПЛАГИН JQUERY FORMATCURRENCY
http://code.google.com/p/jquery-formatcurrency/


другой вариант (если вы используете ASP.Net razor view), на ваш взгляд, вы можете сделать

<div>@String.Format("{0:C}", Model.total)</div>

это отформатирует его правильно. Примечание (пункт.итого-double / decimal)

Если в jQuery вы также можете использовать Regex

$(".totalSum").text('$' + parseFloat(total, 10).toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, ",").toString());

расширение ответа Melu вы можете сделать это, чтобы функционализировать код и обрабатывать отрицательные суммы.

Пример Вывода:
5.23$
- 5.23$

function formatCurrency(total) {
    var neg = false;
    if(total < 0) {
        neg = true;
        total = Math.abs(total);
    }
    return (neg ? "-$" : '$') + parseFloat(total, 10).toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, ",").toString();
}

как следствие того, почему плагин jQuery FormatCurrency является хорошим ответом, я хотел бы опровергнуть ваш комментарий:

1. code.google.com/p/jquery-formatcurrency -не отфильтровывает все буквы. Можно ввести одну букву, и она не будет удаляться.

да, formatCurrency() сам по себе не фильтрует письма:

// only formats currency
$(selector).formatCurrency();

но toNumber (), включенный в плагин formatCurrency, делает.

вы таким образом Хотите do:

// removes invalid characters, then formats currency
$(selector).toNumber().formatCurrency();

использовать С помощью jQuery.свойство маска ввода 3.x. Смотрите демо здесь

включаемые файлы:

<script src="/assets/jquery.inputmask.js" type="text/javascript"></script>
<script src="/assets/jquery.inputmask.extensions.js" type="text/javascript"></script>
<script src="/assets/jquery.inputmask.numeric.extensions.js" type="text/javascript"></script>

и код как

$(selector).inputmask('decimal',
  { 'alias': 'numeric',
    'groupSeparator': '.',
    'autoGroup': true,
    'digits': 2,
    'radixPoint': ",",
    'digitsOptional': false,
    'allowMinus': false,
    'prefix': '$ ',
    'placeholder': '0'
  }
);

основные характеристики:

  • прост в использовании
  • дополнительные детали anywere в маске
  • возможность определить псевдонимы, которые скрывают сложность
  • маски даты / времени
  • числовые маски
  • много обратных вызовов
  • нежадный маски!--16-->
  • многие функции могут быть включены/отключены / настроены с помощью опций
  • поддерживает только чтение/отключено/dir="rtl" атрибуты
  • поддержка данных-inputmask атрибут(ы)
  • поддержка нескольких масок
  • поддержка regex-mask
  • поддержка динамической маски
  • предварительная обработка-поддержка маски
  • форматирование / проверка значения без элемента ввода

я использовал плагин валюты формата jquery, но в последнее время он был очень багги. Мне нужно только форматирование для USD / CAD, поэтому я написал свое собственное автоматическое форматирование.

$(".currencyMask").change(function () {
            if (!$.isNumeric($(this).val()))
                $(this).val('0').trigger('change');

            $(this).val(parseFloat($(this).val(), 10).toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, ",").toString());
        });

просто установите класс любого ввода, который должен быть отформатирован как валюта <input type="text" class="currencyMask" /> и он будет форматировать его отлично в любом браузере.


попробуйте regexp валюты с jQuery (не плагин):

$(document).ready(function(){
  $('#test').click(function() {
    TESTCURRENCY = $('#value').val().toString().match(/(?=[\s\d])(?:\s\.|\d+(?:[.]\d+)*)/gmi);
    if (TESTCURRENCY.length <= 1) {
      $('#valueshow').val(
        parseFloat(TESTCURRENCY.toString().match(/^\d+(?:\.\d{0,2})?/))
      );
    } else {
      $('#valueshow').val('Invalid a value!');
    }
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<input type="text" value="12345.67890" id="value">
<input type="button" id="test" value="CLICK">
<input type="text" value="" id="valueshow">

Edit: новая проверка значения valid / invalid


плагин jQuery для проверки формата валюты здесь Auto Numeric-форматирование валюты легко.


Jus наткнулся на это, поскольку у меня была та же проблема. Очень просто и быстро implememt:

http://plentz.github.io/jquery-maskmoney/