Définit le style de la bordure droite
Vous souhaitez appliquer un des gestionnaires d'événements comme suit... Référence des attributs de l'événement qui seraient utilisés pour capturer un événement...
Vous souhaitez peut-être appliquer un des gestionnaires d'événements en ligne comme suit :
Syntaxe :
<element événement="script">contenue de l’élément</element>
Exemple : Copier le code
<!DOCTYPE html>
<html lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>html5 demo</title>
</head>
<body>
Paragraphe : <input type="text" id="champ1" value="Bonjour le
monde !"><br>
Conteneur : <input type="text" value= "Cliquez moi"
onclick="this.value=document.getElementById('champ1').value;">
<br><br>
<p>On cliquant sur l’élément conteneur le texte dans l’élément Paragraphe est y
copié </p>
</body>
</html>
Mais cette méthode est déconseillée, car elle mélange la structure du document et son contenu HTML avec le code (JavaScript). La meilleur option consiste à utiliser soit un code JavaScript dans le head de la page ou un fichier javascript, ce type conserve la structure du document et les contenus séparé du comportement javascript.
Exemple : Copier le code
<!DOCTYPE html>
<html lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>html5 demo</title>
<script>
function copierTexte()
{
document.getElementById( "champ2").value=document.getElementById( "champ1").value;
}
</script>
</head>
<body>
Paragraphe: <input type="text" id="champ1" value="Bonjour le monde!"><br>
Conteneur: <input type="text" id="champ2">
<br><br>
<button onclick="copierTexte()">Copier le texte
</button>
<p>Une fonction est déclenchée lorsque le bouton est cliqué. La fonction copie
le texte de champ1 en champ2.</p>
</body>
</html>
Cette référence couvre les attributs de l'événement qui seraient utilisés pour capturer un
événement et déclencher une action avec un langage de script côté client tels que
JavaScript.
Pour en savoir plus sur la programmation javascript, veuillez consulter notre tutoriel JavaScript.
Voici les attributs d'événement global pouvant être ajoutés aux éléments HTML pour définir
les actions d'événement.
Nouveau : Nouveau attribut d'événement en HTML5.
Événements déclenchés pour l'objet window (s'applique à la balise <body>) :
|
Attribut |
Valeur |
Description |
|---|---|---|
| onafterprint Nouveau | script | Script à exécuter après que le document est imprimé |
| OnBeforePrint Nouveau | script | Script à exécuter avant que le document soit imprimé |
| OnLoad | script | Se déclenche lorsque le chargement de la page est terminé |
| OnResize Nouveau | script | Se déclenche lorsque la fenêtre du navigateur est redimensionnée |
| OnUnload | script | Se déclenche une fois qu'une page a été déchargé (ou la fenêtre du navigateur a été
fermée) (c'est-à-dire : lorsque l’utilisateur quitte le document) |
Événements déclenchés par des actions à l'intérieur d'un formulaire HTML (s'appliquent à presque tous les éléments HTML, mais ils sont plus utilisé dans les éléments de formulaire) :
|
Attribut |
Valeur |
Description |
|---|---|---|
| onblur | script | Se déclenche au moment où l'élément du formulaire perd le focus |
| OnChange | script | Se déclenche au moment où la valeur de l'élément est modifiée |
| OnContextMenu Nouveau | script | Script à exécuter lorsqu'un menu contextuel est déclenché |
| onfocus | script | Se déclenche au moment où l'élément obtienne le focus |
| Onformchange Nouveau | script | Script à exécuter lorsqu'un formulaire est modifié |
| Onforminput Nouveau | script | Script à exécuter lorsqu’un utilisateur saisi des données dans le formulaire |
| Oninput Nouveau | script | Script à exécuter lorsqu’un utilisateur saisi des données dans l'élément du formulaire |
| Oninvalid Nouveau | script | Script à exécuter lorsqu'un élément n’est pas valide |
| onreset | script | Se déclenche lorsqu'un utilisateur clic sur le bouton de réinitialisation dans un
formulaire n’est pas pris en charge en HTML5 |
| onselect | script | Est déclenché après que le texte ou une partie du texte a été sélectionné dans un élément |
| onsubmit | script | Se déclenche lorsqu'un formulaire est soumis. |
|
Attribut |
Valeur |
Description |
|---|---|---|
| OnKeyDown | script | Se déclenche lorsqu'un utilisateur presse une touche |
| OnKeyPress | script | Se déclenche lorsqu'un utilisateur appuie sur une touche puis la relâche |
| OnKeyUp | script | Se déclenche lorsque l'utilisateur relâche une touche. |
Événements déclenchés par une souris ou une actions similaire de l'utilisateur :
|
Attribut |
Valeur |
Description |
|---|---|---|
| OnClick | script | Se déclenche si par un click de la souris sur l'élément |
| ondblclick | script | Se déclenche si par un double click de la souris sur l'élément |
| OnDrag Nouveau | script | Script à exécuter lorsque vous faites glisser un élément |
| Ondragend Nouveau | script | Script à exécuter à la fin d'une opération glisser |
| OnDragEnter Nouveau | script | Script à exécuter lorsqu'un élément a été déplacé vers une cible de déplacement valide |
| OnDragLeave Nouveau | script | Script à exécuter lorsque l'élément quitte une cible de déplacement valide |
| OnDragOver Nouveau | script | Script à exécuter lorsqu'un élément est déplacé sur une cible de déplacement valide |
| Ondragstart Nouveau | script | Script à exécuter au début d'une opération glisser |
| OnDropNouveau | script | Script à exécuter lorsque l'élément déplacé est relâche. |
| OnMouseDown | script | Se déclenche lorsqu'un bouton de la souris est appuyé sur un élément |
| OnMouseMove | script | Se déclenche lorsque le pointeur de la souris bouge sur un élément |
| onmouseout | script | Se déclenche lorsque le pointeur de la souris quitte un élément |
| onmouseover | script | Se déclenche lorsque le pointeur de la souris se déplace sur un élément |
| OnMouseUp | script | Se déclenche lorsqu'un bouton de la souris est relâché sur un élément |
| OnMouseWheel Nouveau | script | Script à exécuter lors de la rotation de la roulette de la souris |
| Onscroll Nouveau | script | Script à exécuter lorsque la barre de défilement de l'élément en cours défilement |
Événements déclenchés par des médias tels que vidéos, images et fichiers audio (s'applique à tous les éléments HTML, mais plus fréquemment utilisés dans les éléments multimédias, comme <audio>, <embed>, <img>, <object> et <video>) :
|
Attribut |
Valeur |
Description |
|---|---|---|
| OnAbort | script | Script à exécuter sur l'abandon d’un événement |
| oncanplayNouveau | script | Script à exécuter lorsqu'un fichier est prêt à commencer à jouer (quand il a tamponné assez pour commencer) |
| oncanplaythroughNouveau | script | Script à exécuter lorsqu'un fichier peut être lu jusqu'à la fin, sans interruption pour la mise en mémoire tampon |
| ondurationchangeNouveau | script | Script à exécuter lorsque la longueur des médias change |
| onemptiedNouveau | script | Script à exécuter lorsque pour une raison inconnu le fichier n'est soudainement plus disponible (comme déconnection inopinée) |
| onendedNouveau | script | Script à exécuter lorsque la lecture du média est allée jusqu'au bout (un événement utile pour les messages comme « Merci pour l'écoute ») |
| OnErrorNouveau | script | Script à exécuter lorsqu'une erreur se produit quand le fichier est en cours de chargement |
| onloadeddataNouveau | script | Script à exécuter lors du chargement de données du média |
| onloadedmetadataNouveau | script | Script à exécuter lorsque les métadonnées (comme les dimensions et durée) sont chargées |
| onloadstartNouveau | script | Script à exécuter lorsque le navigateur commence à charger un élément média |
| OnPauseNouveau | script | Script à exécuter lorsque le média est mis en pause par l'utilisateur ou par un programme |
| OnPlayNouveau | script | Script à exécuter lorsque le média est prêt à commencer à jouer |
| onplayingNouveau | script | Script à exécuter lorsque le média commence à jouer |
| OnProgressNouveau | script | Script à exécuter lorsque le navigateur charge les données d’un élément média |
| onratechangeNouveau | script | Script à exécuter chaque fois que les données de la lecture d’un élément média ont changé (comme lorsqu'un utilisateur bascule vers le mode avance rapide ou le mode ralenti) |
| onreadystatechangeNouveau | script | Script à exécuter à chaque fois que « prêt pour la lecture » change |
| onseekedNouveau | script | Script à exécuter lorsque l'attribut recherche a la valeur false qui indique que la recherche a pris fin |
| onseekingNouveau | script | Script à exécuter lorsque l'attribut cherche est défini à true indiquant que cherche est active |
| onstalledNouveau | script | Script à exécuter lorsque le navigateur ne parvient pas à extraire les données du média pour une raison quelconque |
| onsuspendNouveau | script | Script à exécuter lorsque pour une raison quelconque l'extraction des données du média est arrêté avant qu'il soit complètement chargé. |
| ontimeupdateNouveau | script | Script à exécuter lorsque la position de lecture a été modifiées (comme lorsque l'utilisateur fait avancer la lecture à un point différent dans le média) |
| onvolumechangeNouveau | script | Script à exécuter chaque fois que le volume est modifié (y compris le réglage du volume sur « muet ») |
| OnWaitingNouveau | script | Script à exécuter lorsque le média est suspendu mais devrait reprendre |