Nur bestimmte Zeichen in HTML input Feld erlauben (JavaScript)?
Hi, der Titel erklärt eigentlich schon mein Problem Für meinen Code brauche ich momentan Hilfe, denn ich weiß nicht wie man es codet, dass man in ein input field nur bestimmte Zeichen erlauben kann. Bei Straßennamen bspw. Buchstaben wie "ß,ö,ü" usw. und halt auch Zahlen die dazugehören. Und gibt es document.getElementById("id-name").size noch? Mir wird in meinem Programm nur sizeToContent vorgeschlagen. Ich danke euch schon mal :)
3 Antworten
Versuch's mal mit document.getElementById("id-name").value.size
Du solltest Dir vorher überlegen, welche Zeichen Du denn überhaupt verbieten willst:
- Es gibt mit Sicherheit irgendwo eine "Carl-von-Linné-Straße"
- Du kannst davon ausgehen, dass fast jeder größere französische Ort in irgendeiner Straße verewigt wurde.
- In Mannheim gibt es anstelle von Straßen Blockbezeichnungen A1, C5 usw.
Ansonsten funktionieren wohl die hier vorgeschlagenen regulären Ausdrücke leidlich, wenn man damit leben will, dass Großbuchstaben mitten im Wort stehen können oder die Angabe mit Leerzeichen oder Bindestrich beginnen kann.
Die vorgeschlagene Lösung mit dem pattern-Attribut ist die richtige. Nur als offensichtliche Ergänzung: Sollten die Daten an einen Server gesendet werden, dann muss das Server-Skript diese Daten noch einmal überprüfen und darf sich nicht darauf verlassen, dass sie bestimmten Regeln folgen, unabhängig davon was im Frontend passiert ist. Ich kann jede Frontend-Validierung umgehen.
<input type="text" pattern="[a-zA-Z0-9äöüßÄÖÜ]*">
erlaubt nur die Eingabe von kleinbuchstaben, GROSSBUCHSTABEN und Ziffern.
Alex
Danke dir, scheint die simpelste Lösung zu sein, aber es soll in JavaScript erfolgen :D Gibt es dazu ein Pendant (Gegenstück)?
aber es soll in JavaScript erfolgen
geht auch. Aber wozu?
<!doctype html>
<title>fool's solution</title>
<script>
function check(str) {
if (str.match(/^[a-zA-Z0-9äöüÄÖÜß\/\ ]*$/)) {
alert("Passt!");
} else {
alert("Passt nicht!");
}
}
</script>
<form>
<p><input id="strasse" onchange="check(this.value)"></p>
<p><input type="submit"></p>
</form>
Ist halt so vorgegeben und ich wusste nicht weiter^^ Könntest du den Teil hier eventuell erläutern? "/^[a-zA-Z0-9äöüÄÖÜß\/\ ]*$/" Das in den eckigen Klammern wird wohl ein Array sein, aber was hat es mit den Slashes, dem "^", sowie dem "*" und dem Dollarzeichen auf sich? Ich habe da etwas gegoogelt, aber konnte nix dazu finden :/
Das ist ein "regulärer Ausdruck" (regular expression). https://wiki.selfhtml.org/wiki/JavaScript/Objekte/RegExp
Ok hab es mir durchgelesen, danke dir. Letzte Frage denke ich :D Wenn ich die maximale Länge einer bspw. Postleitzahl festlegen will, müsste man das dann folgendermaßen machen? var plz = /^[0-9].{5}$/;
Worauf ein regex matcht kannst Du hier testen: https://regex101.com
Besser ist das:
Dann kannst der User auch noch Leerzeichen und den Schärgstrich eingeben, so dass eine Eingabe
möglich ist. Meist ist aber die Vorgabe eines bestimmten Formats keine gute Idee.