Hoe kan ik de valuta correct formatteren met jQuery?

Ik heb geen masker nodig, maar ik heb iets nodig dat valuta opmaakt (in alle browsers) en niet toestaan ​​dat alle letters of speciale Char’s worden getypt. Bedankt voor de hulp

Voorbeeld:

Geldig: $ 50.00
$ 1.000.53

Niet geldig: $ w45.00
$ 34.3R6


Antwoord 1, Autoriteit 100%

JQuery FormationCurrency Plugin
http://code.google.com/p/jQuery-formatcurrency/


Antwoord 2, Autoriteit 202%

Nog een optie (als u ASP.NET Razor View) gebruikt, kunt u van uw mening

doen

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

Dit zou het correct formatteren. Opmerking (item.total is dubbel / decimaal)

Als je in jQuery ook Regex

kunt gebruiken

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

Antwoord 3, Autoriteit 78%

Het antwoord van Melu uitbreiden U kunt dit doen om de code te functioneren en negatieve bedragen te behandelen.

Monsteruitgang:
$ 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, "$1,").toString();
}

Antwoord 4, Autoriteit 40%

Als een corollary op waarom de jQuery-indelingscurrency-plugin een goed antwoord is, wil ik uw commentaar weerleggen:

1. code.google.com/p/jquery-formatcurrency – Filtert niet alle letters. U kunt een enkele letter typen en deze zal deze niet verwijderen.

Ja, formatCurrency() op zichzelf filtert geen letters:

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

Maar toNumber(), opgenomen in de formatCurrency-plug-in, wel.

U wilt dus het volgende doen:

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

Antwoord 5, autoriteit 32%

Gebruik jquery.inputmask 3.x.
Bekijk demo’s hier

Bestanden opnemen:

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

En codeer als

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

Hoogtepunten:

  • gemakkelijk te gebruiken
  • optionele onderdelen in het masker
  • mogelijkheid om aliassen te definiëren die complexiteit verbergen
  • datum / datetime maskers
  • numerieke maskers
  • veel terugbellen
  • niet-hebzuchtige maskers
  • veel functies kunnen worden ingeschakeld/uitgeschakeld/geconfigureerd door opties
  • ondersteunt alleen-lezen/uitgeschakeld/dir=”rtl”-kenmerken
  • ondersteunt data-inputmask-attribuut(en)
  • ondersteuning voor meerdere maskers
  • regex-mask-ondersteuning
  • dynamic-mask-ondersteuning
  • ondersteuning voor voorverwerking van maskers
  • waardeopmaak / validatie zonder invoerelement

Antwoord 6, autoriteit 20%

Vroeger gebruikte ik de valuta-plug-in in jQuery-indeling, maar deze is de laatste tijd erg gebrekkig. Ik heb alleen opmaak nodig voor USD/CAD, dus heb ik mijn eigen automatische opmaak geschreven.

$(".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, "$1,").toString());
        });

Stel gewoon de klasse in van de invoer die moet worden opgemaakt als valuta <input type="text" class="currencyMask" />en het zal het perfect formatteren in elke browser.

p>


Antwoord 7, autoriteit 8%

Probeer regexp-valuta met jQuery (geen plug-in):

$(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">

Other episodes