Attribut d'Événement ondragleave en HTML
Exemple
Exécutez un script JavaScript lorsqu'un élément déplaçable est déplacé hors d'une zone de dépôt :
<div ondragleave="myFunction(event)"></div> Définition et Utilisation
L'attribut ondragleave se déclenche lorsqu'un élément déplaçable ou une sélection de texte quitte une zone de dépôt valide.
Les événements ondragenter et ondragleave aident l'utilisateur à comprendre qu'un élément déplaçable est sur le point d'entrer ou de quitter une zone de dépôt. Cela peut être réalisé, par exemple, en définissant une couleur de fond lorsque l'élément déplaçable entre dans la zone de dépôt, et en supprimant cette couleur lorsque l'élément est déplacé hors de la cible.
Le glisser-déposer est une fonctionnalité très courante en HTML5. Cela consiste à "attraper" un objet et à le faire glisser vers un autre emplacement. Pour plus d'informations, consultez notre tutoriel HTML sur HTML5 Glisser et Déposer .
Remarque : Pour rendre un élément déplaçable, utilisez l'attribut global HTML5 draggable .
Astuce : Les liens et les images sont déplaçables par défaut et n'ont pas besoin de l'attribut draggable.
Il existe de nombreux attributs d'événements qui sont utilisés et peuvent se produire à différentes étapes d'une opération de glisser-déposer :
- Événements déclenchés sur la cible déplaçable (l'élément source) :
- ondragstart - se déclenche lorsque l'utilisateur commence à faire glisser un élément
- ondrag - se déclenche lorsqu'un élément est en cours de glissement
- ondragend - se déclenche lorsque l'utilisateur a terminé de faire glisser l'élément
- Événements déclenchés sur la cible de dépôt :
- ondragenter - se déclenche lorsque l'élément glissé entre dans la zone de dépôt
- ondragover - se déclenche lorsque l'élément glissé est au-dessus de la zone de dépôt
- ondragleave - se déclenche lorsque l'élément glissé quitte la zone de dépôt
- ondrop - se déclenche lorsque l'élément glissé est déposé sur la zone de dépôt
Support des Navigateurs
Les chiffres dans le tableau spécifient la première version du navigateur qui prend entièrement en charge l'attribut d'événement.
| Attribut d'Événement | |||||
|---|---|---|---|---|---|
| ondragleave | 4.0 | 9 | 9 | 3.1 | 12 |
Syntaxe
< élément ondragleave=" script "> Valeurs d'Attribut
| Valeur | Description |
|---|---|
| script | Le script à exécuter lors de l'événement ondragleave |
Détails Techniques
| Balises HTML prises en charge : | TOUS les éléments HTML |
|---|
Pages Associées
Tutoriel HTML : HTML5 Glisser et Déposer
Référence HTML : Attribut HTML draggable
Référence DOM HTML : Événement ondragleave