Extrait du cours: Programmation JavaScript: HTML dynamique (suite)
La gestion des événements
cf. http://fr.selfhtml.org/javascript/langage/gestevenements.htm Deux méthodes pour surveiller des événements :
– appliquer un gestionnaire d’événement au niveau d’un élément HTML
– Programmer une surveillance d’événement en Javascript
Gestionnaires d’événement
Le gestionnaire d’événement est appliqué sous la forme d’un attribut HTML (préfixé par on…).
<button onClick= »alert(‘click’); »>Clickez ici</button>
Evénements liés au clavier
onKeydown (une touche est enfoncée), onKeyup (une touche est relâchée), onKeypress (survient après onKeydown)
Evénements liés à la souris
onMousedown (bouton de souris enfoncé), onMouseup (bouton de souris relaché), onClick (survient après onMouseDown et onMouseUp), onDblClick (double click), onMousemove (déplacement du pointeur), onMouseover (survol de l’objet ), onMouseout (sortie de l’objet)
Evénements liés au document
onError (une erreur est survenue), onLoad (chargement de la page), onUnload (on quitte la page)
Evénements liés à des champs de formulaire
onFocus (réception du focus), onBlur (perte du focus), onChange (changement de valeur), onReset (réinitialisation des champs), onSelect (sélection de texte dans un champ textarea ou input), onSubmit (envoi du formulaire)
Programmer une surveillance d’événement en Javascript
On peut de cette manière définir des événements survenant au niveau du document (et pas forcement liés à un élément HTML). Attention Netscape et IE utilisent des méthodes et des propriétés très différentes pour gérer les événements.
Sous Netscape, la surveillance d’un événement concernant le document est activée grâce à la méthode prenant l’objet Event comme argument: document.captureEvents(). Pour activer la surveillance des événements KEYDOWN, KEYUP, MOUSEMOVE, CLICK il faut donc écrire.
document.captureEvents(Event.KEYDOWN);
document.captureEvents(Event.KEYUP);
document.captureEvents(Event.MOUSEMOVE);
document.captureEvents(Event.CLICK);
Les événements surveillés peuvent être: Event.ABORT Event.BLUR Event.CHANGE Event.CLICK Event.DBLCLICK Event.DRAGDROP Event.ERROR Event.FOCUS Event.KEYDOWN Event.KEYPRESS Event.KEYUP Event.LOAD Event.MOUSEDOWN Event.MOUSEMOVE Event.MOUSEOUT Event.MOUSEOVER Event.MOUSEUP Event.MOVE Event.RESET Event.RESIZE Event.SELECT Event.SUBMIT Event.UNLOAD.
………..
Programmation JavaScript: HTML dynamique (suite) (112 KO) (Cours PDF)