Möchten Sie verhindern, dass Benutzer Zahlen in Ihre einzeiligen Textfelder eingeben? Sie können zwar Eingabemasken verwenden, um Felder nur auf Alpha-Zeichen zu beschränken, aber diese Anleitung zeigt Ihnen, wie Sie eine flexiblere Lösung erstellen können, die sowohl Groß- als auch Kleinbuchstaben zulässt und gleichzeitig Zahlen blockiert.
In diesem Tutorial zeigen wir Ihnen das notwendige Code-Snippet, um Zahlen in diesen Feldern einzuschränken.
Einrichten des Formulars
Erstellen Sie zunächst ein neues Formular und fügen Sie ein einzeiliges Textfeld hinzu, das Sie einschränken möchten. In unserem Beispiel verwenden wir es als Feld für den Benutzernamen. Wenn Sie Hilfe beim Erstellen eines Formulars benötigen, lesen Sie unsere Anleitung zum Erstellen Ihres ersten Formulars.
Notieren Sie sich die ID Ihres Formulars und die Feld-ID, da Sie diese für den Code benötigen. Wenn Sie nicht sicher sind, wie Sie diese IDs finden, lesen Sie bitte unseren Leitfaden zur Ermittlung von Formular- und Feld-IDs.
Hinzufügen des Validierungscodes
Dieser Code verhindert das Absenden des Formulars, wenn Zahlen in dem Feld erkannt werden. Wenn Sie Hilfe beim Hinzufügen von Code zu Ihrer Website benötigen, lesen Sie bitte unsere Anleitung zum Hinzufügen von benutzerdefiniertem Code zu einer WordPress-Website.
Ersetzen Sie die folgenden Werte im PHP-Code:
- In Zeile 11: Ersetzen Sie 1000 durch Ihre Formular-ID
- In Zeile 17: Ersetzen Sie 25 durch Ihre Feld-ID
- In Zeile 22: Ersetzen Sie 25 wieder durch Ihre Feld-ID
Wenn das Feld Benutzername beim Absenden des Formulars Zahlen enthält, wird eine Fehlermeldung angezeigt und das Formular wird nicht abgesendet.
Option Echtzeit-Validierung
Wenn Sie verhindern möchten, dass Benutzer vor dem Absenden des Formulars Zahlen eingeben, können Sie eine Echtzeit-Validierung implementieren. So geht's:
Bearbeiten Sie zunächst das Formular und klicken Sie bei ausgewähltem Feld Einzeiliger Text auf die Registerkarte Erweitert unter Feldoptionen und fügen Sie dem Feld CSS-Klassen keine Zahlen hinzu.
Fügen Sie dann diesen JavaScript-Code in Ihre Website ein:
Sobald das Snippet hinzugefügt wurde, wird eine sofortige Fehlermeldung angezeigt, die den Besucher auf den Überprüfungsfehler hinweist, wenn er mit der Tabulatortaste auf das Feld klickt oder es verlässt.
Referenz Aktion
Möchten Sie auch verhindern, dass Sonderzeichen in ein einzeiliges Textformularfeld eingegeben werden? Schauen Sie sich das Tutorial über die Einschränkung von Sonderzeichen in einem Formularfeld an.