Einfachste Möglichkeit, Zeichen in HTML (5) Texteingabe zu maskieren
Macht HTML5 jede Art von Textfeld Maskierung oder muss ich noch Falle onkeydown
etc.?
jbabey richtig ist - "Maskierung", wie blockieren bestimmte unzulässige Zeichen, nicht verstecken, was die eingegeben haben.
Die besten (wie in der einfachste und zuverlässigste) Möglichkeit, die ich gefunden habe, ist trap onkeyup
und dann führen Sie einfach ein regex ersetzen, die auf den Wert des textfield-Objekts, entfernen Sie alle ungültigen Zeichen.
Dies hat einige Vorteile:
- Es ist einfach zu implementieren (eine Funktion, die zwei Zeilen code).
- Es ist zuverlässig und deckt alle Fälle habe ich gedacht.
- Es nicht zu blockieren-key-Befehle wie kopieren/einfügen, alles auswählen oder Pfeil-Tasten.
Aber sein großer Nachteil ist, dass Sie zeigt das eingegebene Zeichen(s) kurz vor, Sie zu entfernen, das macht es so Aussehen sehr hackish und unprofessionell.
InformationsquelleAutor der Frage devios1 | 2012-06-04
Du musst angemeldet sein, um einen Kommentar abzugeben.
Blick auf das neue HTML5-Input-Typen. Diese weisen-Browser clientseitige Filterung der Daten, aber die Umsetzung ist unvollständig in unterschiedlichen Browsern. Die
pattern
Attribut tun regex-Stil-Filterung, aber, wieder, der Browser nicht vollständig (oder überhaupt) unterstützen.Aber diese wird nicht blockiert die Eingabe selbst, es wird einfach verhindern, dass die Einreichung des Formulars mit den ungültigen Daten. Du musst noch die trap -
onkeydown
Veranstaltung zu block-Schlüssel eingeben, bevor Sie auf dem Bildschirm angezeigt.InformationsquelleAutor der Antwort saluce
Ja, nach HTML5-Entwürfe, die Sie verwenden können, die
pattern
- Attribut angeben, die erlaubt die Eingabe mit einem regulären Ausdruck. Für einige Arten von Daten, Sie können spezielle Eingabe-Felder wie<input type=email>
. Aber diese Funktionen noch weitgehend fehlende Unterstützung oder qualitativ schlechten support.InformationsquelleAutor der Antwort Jukka K. Korpela
Basic-Validierung kann durchgeführt werden, indem Sie die type-Attribut der input-Elemente. Zum Beispiel:
<input type="email" />
<input type="URL" />
<input type="number" />
mit Muster Attribut wie:
<input type="text" pattern="[1-4]{5}" />
erforderlich Attribut
<input type="text" required />
maxlength:
<input type="text" maxlength="20" />
min & max:
<input type="number" min="1" max="4" />
InformationsquelleAutor der Antwort
Ist ein wenig spät, aber ein nützliches plugin, das eigentlich eine Maske zu geben, ein bisschen mehr Beschränkung auf user-input.
Weitere Infos auf der Plug-in http://www.jasny.net/bootstrap/javascript/#inputmask
InformationsquelleAutor der Antwort Stephen Romero