Событие ondragleave возникает, когда перетаскиваемый элемент или выделенный текст выходит за пределы принимающего элемента.
Перетаскивание объекта (drag-and-drop) довольно обычная функция в HTML5. Это когда пользователь "берет" мышью некий объект и перемещает его в другое место.
Чтобы сделать элемент перетаскиваемым, нужно установить атрибут draggable.
Ссылки и изображения являются перетаскиваемыми по умолчанию и не требуют установки атрибута draggable.
Существует множество событий, которые возникают на различных стадиях операции перетаскивания. И соответственно для них существуют соответствующие атрибуты:
События, возникающие в перемещаемом объекте (исходный элемент):
- ondragstart – возникает, когда пользователь начинает перемещать элемент
- ondrag – возникает во время перемещения элемента
- ondragend - возникает, когда пользователь заканчивает перемещать элемент
События, возникающие в объекте-приемнике:
- ondragenter - возникает, когда перемещаемый элемент входит в принимающий объект
- ondragover - возникает, когда перемещаемый элемент проходит над принимающим объектом
- ondragleave - возникает, когда перемещаемый элемент покидает принимающий объект
- ondrop - возникает, когда пользователь отпускает перемещаемый элемент
Атрибут ondragleave был добавлен в HTML5.
Особенности
Поддерживаются все HTML теги.
Синтаксис атрибута
<element ondragleave="script">
Значения атрибута
| Значение | Описание |
|---|---|
| script | Скрипт, исполняющийся при возникновении события |
Пример использования атрибута
Запускает скрипт, когда перетаскиваемый элемент выходит за пределы принимающего объекта:
<p draggable="true" ondragleave="myFunction(event)">Перетащи меня!</p>
