INPUT Feld als Währung während der Eingabe formatieren

[Rolf B]

Hallo Franz,

es gibt in HTML keinen Input-Typ "currency", und damit bist Du eigentlich - gerade bei der Eingabe - schon ausgezählt. Du kannst etwas tricksen, indem Du dem input den Rand klaust und den Rand mit einem span drumherum wieder hinzufügst. Dann kannst Du das € Zeichen per HTML hinter die Eingabe kleben.

span.input-currency {
  border: 1px solid black;;
  display:inline-block;
}
span.input-currency input {
  border: none;
}

<span class="input-currency"><input type="number"> €</span>

Ein Tausenderseparator während der Eingabe würde bedeuten, dass Du nach jedem change des Input-Elements den Inhalt ausliest, alles außer Ziffern entfernst und dann Tausenderpunkte einsetzt. Keine Ahnung, welche Anwendererfahrung das bedeutet. Copy im Input-Feld und Paste anderswo würde den Tausenderpunkt mitnehmen. Allerdings artet das in ein wüstes Gefummel mit der Cursorposition aus, das ist mir jetzt in 10 Minuten Basteln nicht gelungen. Da muss man den Wert vor der Eingabe haben, muss gucken, wieviele Punkte im alten Feldinhalt links vom Cursor waren, sehr umständlich. Wenn Du keine Berührungsängste zu jQuery hast, da gibt's ein passendes Plugin. Aber mutmaßlich gibt's sowas auch stand-alone.

Rolf