Gestion des événements spécifiques aux formulaires avec jQuery

Dans cette leçon, nous allons découvrir les méthodes jQuery nous permettant de gérer les événements généralement liés aux éléments de formulaires.

 

Les méthodes focus() et focusin()

Un élément a le focus lorsqu’il est l’élément actif du document c’est-à-dire l’élément dans lequel le curseur de la souris est bloqué. Lorsqu’on clique dans un champ de formulaire, par exemple, cet élément de champ de formulaire possède le focus.

Le jQuery nous offre deux méthodes pour gérer l’événement “prise de focus d’un élément” : les méthodes focus() et focusin()focus() permet d’attacher un gestionnaire d’événement pour l’événement focus. L’événement focus est envoyé à un élément lorsqu’il gagne le focus.

La méthode focusin() permet d’attacher un gestionnaire d’événement pour l’événement focusin. L’événement focusin est envoyé à un élément lorsque cet élément ou l’un de ses descendants gagne le focus.

En d’autres mots , vous pouvez retenir que la grande différence entre les événements focus et focusin est que focus ne bouillonne pas à la différence de focusin.

See the Pen
Cours jQuery 3.4.1
by Pierre (@pierregiraud)
on CodePen.

 

Les méthodes blur() et focusout()

Le jQuery nous offre deux méthodes pour gérer l’événement “perte de focus d’un élément” : les méthodes blur() et focusout()blur() permet d’attacher un gestionnaire d’événement pour l’événement blur. L’événement blur est envoyé à un élément lorsqu’il perd le focus.

La méthode focusout() permet d’attacher un gestionnaire d’événement pour l’événement focusout. L’événement focusout est envoyé à un élément lorsque cet élément ou l’un de ses descendants perd le focus.

See the Pen
Cours jQuery 3.4.2
by Pierre (@pierregiraud)
on CodePen.

 

La méthode change()

La méthode change() permet d’attacher un gestionnaire d’événement à un élément pour l’événement change. L’événement change se déclenche lorsque la valeur d’un élément change.

Notez que cet événement ne peut se déclencher qu’avec des éléments input, textarea et select. L’événement se déclenche dès qu’un utilisateur fait une sélection dans le cas de cases à cocher (checkbox), de boutons radio, ou de liste d’option. Pour les autres types d’éléments, l’événement ne se déclenche que dès que l’élément perd le focus.

See the Pen
Cours jQuery 3.4.3
by Pierre (@pierregiraud)
on CodePen.

 

La méthode submit()

La méthode submit() permet d’attacher un gestionnaire d’événement à un élément pour l’événement submit. L’événement submit se déclenche dès qu’un utilisateur tente d’envoyer un formulaire. On ne va pouvoir intercepter cet événement que depuis l’élément form.

See the Pen
Cours jQuery 3.4.4
by Pierre (@pierregiraud)
on CodePen.

Laisser un commentaire

© Pierre Giraud - Toute reproduction interdite - Mentions légales