How to implement drag and drop?
1, add the attribute draggable = "ture" is to realize drag element
<div class="dragBox" draggable="ture"></div>
2, js drag related events
Dragged element events:
- When ondragstart drag the beginning of the trigger (triggered once)
- ondrag continuous trigger drag event
- ondragend drag the end of the trigger (triggered once)
Drag to enter the target element of the event:
- ondragenter mouse enters the trigger within the target element (triggered once)
- ondragover mouse to keep firing in the target element
- Event is triggered when leaving the target element ondragleave mouse (once triggered)
- Trigger (trigger time) when you lift the mouse on the target element ondrop
const dragBox = document.querySelector('.dragBox'); dragBox.ondragStart = function(){ this.innerHTML ='1' }