Événements JavaScript
Les événements HTML sont des choses qui arrivent aux éléments HTML.
JavaScript peut déclencher ces événements lorsqu'il est utilisé dans des pages HTML.
Événements HTML
Les événements HTML peuvent être des comportements de navigateur ou des comportements d'utilisateurs.
Voici des exemples d'événements HTML :
Le chargement de la page HTML est terminé
Modifications du champ de saisie HTML
Bouton HTML cliqué
Habituellement, lorsqu'un événement se produit, vous pouvez faire quelque chose.
JavaScript peut exécuter du code lorsqu'un événement est déclenché.
Des attributs d'événement peuvent être ajoutés aux éléments HTML et du code JavaScript peut être utilisé pour ajouter des éléments HTML.
Citations simples :
guillemets doubles :
Dans l'exemple suivant, l'attribut onclick (et le code) est ajouté à l'élément bouton :
Exemple
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <button onclick="getElementById('demo').innerHTML=Date()">现在的时间是?</button> <p id="demo"></p> </body> </html>
Exécuter l'exemple»
Cliquez sur le bouton « Exécuter l'exemple » pour afficher l'exemple en ligne
Dans l'exemple ci-dessus, le code JavaScript modifiera le contenu de l'élément id="demo" .
Dans l'instance suivante, le code modifiera le contenu de son propre élément (en utilisant this.innerHTML) :
Instance
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <button onclick="this.innerHTML=Date()">现在的时间是?</button> </body> </html>
Exécuter l'instance»
Cliquez sur le bouton « Exécuter l'instance » pour afficher l'instance en ligne
JavaScript代码通常是几行代码。比较常见的是通过事件属性来调用: |
Instance
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <p>点击按钮执行 <em>displayDate()</em> 函数.</p> <button onclick="displayDate()">点这里</button> <script> function displayDate(){ document.getElementById("demo").innerHTML=Date(); } </script> <p id="demo"></p> </body> </html>
Exécuter l'instance»
Cliquez sur le bouton "Exécuter l'instance" pour afficher l'instance en ligne
Événements HTML courants
Voici quelques listes d'événements HTML courants :
事件 | 描述 |
---|---|
onchange | HTML 元素改变 |
onclick | 用户点击 HTML 元素 |
onmouseover | 用户在一个HTML元素上移动鼠标 |
onmouseout | 用户从一个HTML元素上移开鼠标 |
onkeydown | 用户按下键盘按键 |
onload | 浏览器已完成页面的加载 |
Plus de listes d'événements : Manuel de référence JavaScript - Événements HTML DOM.
Que peut faire JavaScript ? Les événements
peuvent être utilisés pour gérer la validation du formulaire, la saisie de l'utilisateur, le comportement de l'utilisateur et les actions du navigateur :
L'événement est déclenché au chargement de la page
L'événement est déclenché à la fermeture de la page
L'utilisateur clique sur le bouton pour effectuer l'action
Vérifier la validité de la saisie de l'utilisateur
etc...
Vous pouvez utiliser plusieurs méthodes pour exécuter le code d'événement JavaScript :
Les attributs d'événement HTML peuvent exécuter directement du code JavaScript
Les attributs d'événement HTML peuvent appeler des fonctions JavaScript
Vous Vous pouvez spécifier vos propres gestionnaires d'événements pour les éléments HTML
Vous pouvez empêcher les événements de se produire.
Attendez...
在 HTML DOM 章节中你将会学到更多关于事件及事件处理程序的知识。 |