Wie kann ich die Währung mit jquery richtig formatieren?

Ich brauche keine Maske, aber ich brauche etwas, das die Währung (in allen Browsern) formatiert und die Eingabe von Buchstaben oder Sonderzeichen nicht zulässt. Danke für die Hilfe

Beispiel:

Gültig:
$ 50.00 $ 1,000.53

Nicht gültig: $ w45.00
$ 34.3r6

JQUERY FORMATCURRENCY PLUGIN
http://code.google.com/p/jquery-formatcurrency/

Eine weitere Option (wenn Sie die ASP.Net-Rasiereransicht verwenden) ist: In Ihrer Ansicht können Sie dies tun

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

Dies würde es richtig formatieren. note (item.total ist doppelt / dezimal)

In jQuery können Sie auch Regex verwenden

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

Wenn Sie Melus Antwort erweitern, können Sie dies tun, um den Code zu funktionalisieren und negative Beträge zu verarbeiten.

Beispielausgabe:
$ 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();
}

Als Folge dessen, warum das jQuery FormatCurrency-Plugin eine gute Antwort ist, möchte ich Ihren Kommentar widerlegen:

1. code.google.com/p/jquery-formatcurrency - Filtert nicht alle Buchstaben heraus. Sie können einen einzelnen Buchstaben eingeben, der ihn jedoch nicht entfernt.

Ja, formatCurrency () filtert selbst keine Buchstaben heraus:

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

ToNumber (), das im formatCurrency-Plugin enthalten ist, tut dies jedoch.

Sie möchten also Folgendes tun:

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

Verwenden jquery.inputmask 3.x . Sehen Sie hier Demos

Dateien einschließen:

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

Und Code als

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

Highlights:

• Einfach zu verwenden
• optionale Teile befanden sich in der Maske
• Möglichkeit, Aliase zu definieren, die die Komplexität verbergen
• Datums- / Datums- / Uhrzeitmasken
• numerische Masken
• viele Rückrufe
• nicht gierige Masken
• Viele Funktionen können durch Optionen aktiviert / deaktiviert / konfiguriert werden
• unterstützt schreibgeschützte / disabled / dir = "rtl" -Attribute
• Unterstützung von Dateneingabemaskenattributen.
• Unterstützung für mehrere Masken
• Unterstützung für Regex-Masken
• Unterstützung für dynamische Masken
• Unterstützung der Vorverarbeitungsmaske
• Wertformatierung / Validierung ohne Eingabeelement

Früher habe ich das Währungs-Plugin im JQuery-Format verwendet, aber es war in letzter Zeit sehr fehlerhaft. Ich brauche nur die Formatierung für USD / CAD, also habe ich meine eigene automatische Formatierung geschrieben.

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

Legen Sie einfach die Klasse der Eingaben fest, die als Währung formatiert werden sollen, und formatieren <input type="text" class="currencyMask" />Sie sie in jedem Browser perfekt.

Versuchen Sie es mit der regexp-Währung mit jQuery (kein Plugin) :

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

Bearbeiten: Neu Überprüfen Sie einen Wert auf gültig / ungültig