<html lang="de-de" dir="ltr"><head></head><body>### [So beschränken Sie das Telefonfeld, damit es nur Zahlen akzeptiert](https://wpforms.com/developers/how-to-restrict-phone-field-to-only-accept-numbers/)

**Veröffentlicht:** 12. August 2021
**Autor:** Redaktionsteam

**Auszug:** In diesem Tutorial zeigen wir Ihnen, wie Sie das Telefonfeld mit einem kleinen Skript so einschränken, dass es nur Zahlen akzeptiert.

**Inhalt:**

Möchten Sie das **Telefonfeld** so einschränken, dass es nur Zahlen akzeptiert? Standardmäßig erlauben die Formate **International** und **Smart** die Eingabe von Buchstaben, schlagen aber bei der Validierung fehl, wenn Sie aus dem Feld aussteigen.

![Standard-Telefonvalidierungsfehler wird angezeigt, wenn Sie aus dem Feld aussteigen](https://wpforms.com/wp-content/uploads/2021/08/wpforms-default-phone-validation.jpg)

Mit einem kleinen Code-Snippet können Sie einfach verhindern, dass Tastaturzeichen eingegeben werden, es sei denn, es handelt sich um eine Zahl. Das bedeutet, dass, wenn versucht wird, etwas anderes als Zahlen einzugeben, der Text einfach nicht eingegeben wird, wodurch das Feld deaktiviert wird, bis eine Zahl eingegeben wurde.

## Erstellen des Formulars

Erstellen Sie zuerst ein neues Formular und fügen Sie Ihre Felder hinzu. Wenn Sie Hilfe beim Erstellen Ihres Formulars benötigen, [sehen Sie bitte diese Dokumentation](https://wpforms.com/docs/creating-first-form/ "So erstellen Sie Ihr erstes Formular").

![Erstellen Sie Ihr Formular und fügen Sie Ihre Felder hinzu](https://wpforms.com/wp-content/uploads/2021/08/wpforms-create-your-form.jpg)

## Hinzufügen der CSS-Klasse

Als Nächstes müssen Sie dem **Telefonfeld** eine CSS-Klasse hinzufügen. Wenn ein **Telefonfeld** mit dieser Klasse verwendet wird, akzeptiert es **nur** einen numerischen Wert.

Durch Hinzufügen dieser CSS-Klasse zu jedem Formularfeld, das CSS-Klassen akzeptiert, können Sie dieses Feld so einschränken, dass es nur Zahlen akzeptiert.

Um eine CSS-Klasse hinzuzufügen, wählen Sie das Telefonformularfeld aus, das Sie Ihrem Formular hinzugefügt haben, und fügen Sie im Tab **Erweitert** **numbersOnly** zu den **CSS-Klassen** hinzu.

![Fügen Sie die CSS-Klasse numbersOnly zum Telefonfeld hinzu](https://wpforms.com/wp-content/uploads/2021/08/wpforms-add-css-class.jpg)

## Beschränken des Telefonfelds auf nur Zahlen

Jetzt ist es an der Zeit, den Snippet zu Ihrer Website hinzuzufügen, der das Feld so einschränkt, dass nur Zahlen zugelassen werden.

Wenn Sie Hilfe beim Hinzufügen von Snippets zu Ihrer Website benötigen, [lesen Sie bitte dieses Tutorial](https://wpforms.com/developers/how-to-add-custom-php-or-javascript-for-wpforms/ "So fügen Sie benutzerdefiniertes PHP oder JavaScript für WPForms hinzu").

```

/**
 * Restrict the Phone Field to Only Accept Numbers.
 *
 * @link https://wpforms.com/developers/how-to-restrict-phone-field-to-only-accept-numbers/
 */

function restrict_letters_in_phone_field( ) {
?&gt;

**Kategorien:** Felder

**Schlagwörter:** Javascript

---</body></html>