Chapitre 10 : Les événements
10.1 Généralités
Avec les événements et surtout leur gestion, nous abordons le côté "magique" de Javascript.
En Html classique, il y a un événement que vous connaissez bien. C'est le clic de la souris sur un lien pour vous transporter sur une autre page Web. Hélas, c'est à peu près le seul. Heureusement, Javascript va en ajouter une bonne dizaine, pour votre plus grand plaisir.
Les événements Javascript, associés aux fonctions, aux méthodes et aux formulaires, ouvrent grand la porte pour une réelle interactivité de vos pages.
10.2 Les événements
Passons en revue différents événements implémentés en Javascript.
10.3 Les gestionnaires d'événements
Pour être efficace, il faut qu'à ces événements soient associées les actions prévues par vous. C'est le rôle des gestionnaires d'événements. La syntaxe est
onévénement="fonction()"
Par exemple, onClick="alert('Vous avez cliqué sur cet élément')".
De façon littéraire, au clic de l'utilisateur, ouvrir une boite d'alerte avec le message indiqué.
10.3.1 onclick
Evénement classique en informatique, le clic de la souris.
Le code de ceci est :
<FORM>
<INPUT TYPE="button" VALUE="Cliquez ici" onClick="alert('Vous avez bien cliqué ici')">
</FORM>
Nous reviendrons en détail sur les formulaires dans le chapitre suivant.
10.1 Généralités
Avec les événements et surtout leur gestion, nous abordons le côté "magique" de Javascript.
En Html classique, il y a un événement que vous connaissez bien. C'est le clic de la souris sur un lien pour vous transporter sur une autre page Web. Hélas, c'est à peu près le seul. Heureusement, Javascript va en ajouter une bonne dizaine, pour votre plus grand plaisir.
Les événements Javascript, associés aux fonctions, aux méthodes et aux formulaires, ouvrent grand la porte pour une réelle interactivité de vos pages.
10.2 Les événements
Passons en revue différents événements implémentés en Javascript.
Description | Evénement |
Lorsque l'utilisateur clique sur un bouton, un lien ou tout autre élément. | Clik |
Lorsque la page est chargée par le browser ou le navigateur. | Load |
Lorsque l'utilisateur quitte la page. | Unload |
Lorsque l'utilisateur place le pointeur de la souris sur un lien ou tout autre élément. | MouseOver |
Lorsque le pointeur de la souris quitte un lien ou tout autre élément. Attention : Javascript 1.1 (donc pas sous MSIE 3.0 et Netscape 2). | MouseOut |
Lorsque un élément de formulaire a le focus c-à-d devient la zone d'entrée active. | Focus |
Lorsque un élément de formulaire perd le focus c-à-d que l'utilisateur clique hors du champs et que la zone d'entrée n'est plus active. | Blur |
Lorsque la valeur d'un champ de formulaire est modifiée. | Change |
Lorsque l'utilisateur sélectionne un champ dans un élément de formulaire. | Select |
Lorsque l'utilisateur clique sur le bouton Submit pour envoyer un formulaire. | Submit |
10.3 Les gestionnaires d'événements
Pour être efficace, il faut qu'à ces événements soient associées les actions prévues par vous. C'est le rôle des gestionnaires d'événements. La syntaxe est
onévénement="fonction()"
Par exemple, onClick="alert('Vous avez cliqué sur cet élément')".
De façon littéraire, au clic de l'utilisateur, ouvrir une boite d'alerte avec le message indiqué.
10.3.1 onclick
Evénement classique en informatique, le clic de la souris.
Le code de ceci est :
<FORM>
<INPUT TYPE="button" VALUE="Cliquez ici" onClick="alert('Vous avez bien cliqué ici')">
</FORM>
Nous reviendrons en détail sur les formulaires dans le chapitre suivant.