Eingabetext erlaubt nur drei bestimmte Zeichen

Question

Bei einem Text-Feld, das nur ein Zeichen für die Eingabe akzeptiert, wie folgt:

<input type="text" maxlength="1" name="k1" placeholder="?" /> 

Ist es möglich, weitere Texteingabe zu beschränken, so dass nur ein 1, X oder 2 (wie in einem Wettsystem) validiert?

Answer 1

<input type="text" max-length="1" name="k1" placeholder="?" pattern="[ABC]" /> 

ermöglicht Buchstaben A, B und C. Sie können A, B und C mit etwas ersetzen möchten Sie

Browser-Unterstützung: http://caniuse.com/#feat=input-pattern

Regex Guide: https://msdn.microsoft.com/en-us/library/az24scfc(v=vs.110).aspx

Answer 2

zu ermöglichen 12 und X, hier

bedeuten

pattern = "[12X]" entweder 1, 2 oder X

Hinweis: Nur <input type="text" max-length="1" name="k1" pattern="[12X]" /> Dies wird erst funktionieren, wenn Sie ein Formular und Sie einreichen. Dadurch können Sie ein beliebiges Zeichen in das Eingabefeld eingeben. Dies tritt in Kraft, wenn der Benutzer die Nachricht abschickt.

<form> 
    <input type="text" max-length="1" name="k1" pattern="[12X]" /> 
    <input type="submit"> 
</form> 

Answer 3

Es gibt mindestens zwei Möglichkeiten, dies zu tun, eine beinhaltet die Verwendung des Musterattributs, eine Nicht-JavaScript-Lösung, die sicherlich funktioniert; Siehe Lösungen, die andere unten bereitstellen. Aber wenn Sie wirklich restriktiver sein möchten, ist hier eine JavaScript-Lösung, die den Benutzer auf seiner Spur davon abhält, ungültige Daten zu senden.

HTML:

<form> 
<label>Enter 1, 2, or x</label> 
<input id="myinput" maxlength="1" type="text"> 
<input type="submit"><input type="reset"> 
</form> 

JavaScript:

myinput.oninput = function() { 
    if (myinput.value != 1 && myinput.value != 2 && myinput.value != 'x') { 
    alert("Invalid: " + myinput.value); 
    } 
}; 

Vollarbeitsbeispiel here

Eine gute Ressource, die die oninput und andere Ereignisse untersucht: https://javascript.info/events-change-input