Réagir à l'évènement click
Ajouter le code nécessaire pour réagir à l'évènement click
sur le bouton ci-dessous.
Pour réagir à des évènements (exemple: click
, keydown
, etc.), on peut assigner un handler, une fonction qui est exécutée lors d'un évènement.
Les handlers sont un moyen d'exécuter du code JavaScript lors d'actions par l'utilisateur.
Ajouter le code nécessaire pour réagir à l'évènement click
sur le bouton ci-dessous.
Ajouter le code nécessaire pour réagir à l'évènement keydown
(frappe d'une des touches du clavier).
Ajouter le texte "touche frappée !" dans le <textarea>
ci-dessous, dès que ça se produit.
Pour gérer un évènement, on aimerait bien avoir plus d'infos sur ce qu'il vient de se produire. Pas seulement un click ou un keydown, mais par exemple "quelles sont les coordonnées de la souris, au moment où cet évènement c'est produit ?" ou encore "quelle touche du clavier exactement a été frappée ?", etc.
Lorsqu'un évènement se produit, le navigateur créé un "objet évènement", mets des informations dedans, et le passe en argument au handler.
Ajouter le code nécessaire pour écouter l'évènement click
sur chacun des boutons ci-dessous. Pour en faciliter la sélection, ils possèdent tous la classe btn-4
.
Ajouter le code nécessaire pour écouter l'évènement click
sur le bouton ci-dessous.
Changer le contenu du bouton pour afficher le nombre de fois qu'il a été cliqué, exemple : bouton cliqué 3x
En HTML, lorsqu'un formulaire est envoyé, le navigateur charge (ou recharge) la page.
Nous allons voir qu'il est possible d'empêcher ce comportement, à l'aide de event.preventDefault()
Ajouter le code nécessaire pour empêcher le rechargement de la page, lors de l'envoi (ici le type d'évènement n'est pas click
mais submit
) du formulaire ci-dessous :
Bienvenue dans le dernier exo de notre série !
<input>
, grâce à la syntaxe element.value
, et on l'ajoute à la liste située juste en dessous. D'ailleurs cette liste contient déjà trois entrées, vous pouvez les supprimer via JS.<input>
est vide, on affiche un message dans la console et on n'ajoute pas ce produit, vide, à la liste.