<html lang="fr-fr" dir="ltr"><head></head><body>### [Comment restreindre le champ Téléphone pour n'accepter que les chiffres](https://wpforms.com/developers/how-to-restrict-phone-field-to-only-accept-numbers/)

**Publié :** 12 août 2021
**Auteur :** Équipe éditoriale

**Extrait :** Dans ce tutoriel, nous vous montrerons comment restreindre le champ Téléphone pour n'accepter que les chiffres à l'aide d'un petit script. 

**Contenu :**

Souhaitez-vous restreindre le champ **Téléphone** pour qu'il n'accepte que les chiffres ? Par défaut, les formats de téléphone **International** et **Intelligent** vous permettront de saisir des lettres, mais échoueront à la validation lorsque vous quitterez le champ.

![l'erreur de validation par défaut du téléphone s'affichera lorsque vous quitterez le champ](https://wpforms.com/wp-content/uploads/2021/08/wpforms-default-phone-validation.jpg)

En utilisant un petit extrait de code, vous pouvez facilement désactiver la saisie de tout caractère du clavier, sauf s'il s'agit d'un chiffre. Cela signifie que s'ils tentaient de taper autre chose que des chiffres, le texte ne serait tout simplement pas saisi, désactivant ainsi le champ jusqu'à ce qu'un chiffre soit saisi.

## Création du formulaire

Tout d'abord, vous devrez créer un nouveau formulaire et ajouter vos champs. Si vous avez besoin d'aide pour créer votre formulaire, [veuillez consulter cette documentation](https://wpforms.com/docs/creating-first-form/ "Comment créer votre premier formulaire").

![créez votre formulaire et ajoutez vos champs](https://wpforms.com/wp-content/uploads/2021/08/wpforms-create-your-form.jpg)

## Ajout de la classe CSS

Ensuite, vous devrez ajouter une classe CSS au champ de formulaire **Téléphone**. Chaque fois qu'un champ **Téléphone** avec cette classe est utilisé, il n'acceptera **que** une valeur numérique.

En ajoutant cette classe CSS à tout champ de formulaire qui accepte les classes CSS, vous pouvez restreindre ce champ à n'accepter que les chiffres.

Pour ajouter une classe CSS, sélectionnez le champ de formulaire Téléphone que vous avez ajouté à votre formulaire et, dans l'onglet **Avancé**, ajoutez **numbersOnly** aux **Classes CSS**.

![ajoutez la classe CSS numbersOnly au champ Téléphone](https://wpforms.com/wp-content/uploads/2021/08/wpforms-add-css-class.jpg)

## Restreindre le champ téléphone aux chiffres uniquement

Il est maintenant temps d'ajouter l'extrait à votre site qui restreindra le champ pour n'autoriser que les chiffres.

Si vous avez besoin d'aide pour ajouter des extraits à votre site, [veuillez consulter ce tutoriel](https://wpforms.com/developers/how-to-add-custom-php-or-javascript-for-wpforms/ "Comment ajouter du PHP ou du JavaScript personnalisé pour WPForms").

```

/**
 * Restreindre le champ Téléphone pour n'accepter que les chiffres.
 *
 * @link https://wpforms.com/developers/how-to-restrict-phone-field-to-only-accept-numbers/
 */

function restrict_letters_in_phone_field( ) {
?&gt;

**Catégories :** Champs

**Tags :** Javascript

---</body></html>