Die OTP-Eingabe sieht aus wie eine Reihe von Slots, darunter liegt aber ein einziges natives <input>. SMS-Autofill (autocomplete="one-time-code"), Einfügen, Passwortmanager, Formulare und Screenreader sehen alle ein gewöhnliches Textfeld.
Eingefügte Codes werden bereinigt, sodass „123-456“ und „123 456“ beide funktionieren, und Zeichen, die das Muster nicht erlaubt, werden abgelehnt. Unter Android füllt webOtp den Code aus der SMS aus, sobald sie ankommt.
Verifizierung
(completed) wird ausgelöst, sobald der letzte Slot gefüllt ist. Setze aria-invalid auf das Eingabefeld, um einen Code abzulehnen: Die Slots werden rot und wackeln.
Try 123456, or anything else.
Buchstaben, Gruppen und Maskierung
pattern="alphanumeric" akzeptiert auch Buchstaben, [groups] fügt Trenner ein und masked zeichnet Punkte.