事件
2023年03月04日
一、drag
drag 事件在用户拖动元素或选择的文本时，每隔几百毫秒就会被触发一次。
语法
addEventListener('drag', (event) => {});
ondrag = (event) => { };
属性
DragEvent.dataTransfer: 在进行拖放操作时，传输的数据。
二、dragend
dragend 事件在拖放操作结束时触发（通过释放鼠标按钮或单击 escape 键）。该事件无法取消。
语法
addEventListener('dragend', (event) => {});
ondragend = (event) => { };
属性
DragEvent.dataTransfer: 在进行拖放操作时，传输的数据。
三、dragenter
dragenter 事件在可拖动的元素或者被选择的文本进入一个有效的放置目标时触发。目标对象是用户直接选择的范围（由用户直接指示作为放置目标的元素），或者 <body> 元素。
语法
addEventListener('dragenter', (event) => {});
ondragenter = (event) => { };
属性
DragEvent.dataTransfer: 在进行拖放操作时，传输的数据。
四、dragleave
dragleave 事件在拖动的元素或选中的文本离开一个有效的放置目标时被触发。此事件不可取消。
语法
addEventListener('dragleave', (event) => {});
ondragleave = (event) => { };
属性
DragEvent.dataTransfer: 在进行拖放操作时，传输的数据。
五、dragover
dragover 事件在可拖动的元素或者被选择的文本被拖进一个有效的放置目标时（每几百毫秒）触发。该事件在放置目标上触发。
语法
addEventListener('dragover', (event) => {});
ondragover = (event) => { };
属性
DragEvent.dataTransfer: 在进行拖放操作时，传输的数据。
六、dragstart
dragstart事件在用户开始拖动元素或被选择的文本时调用。
语法
addEventListener('dragstart', (event) => {});
ondragstart = (event) => { };
属性
DragEvent.dataTransfer: 在进行拖放操作时，传输的数据。
七、drop
drop 事件在元素或选中的文本被放置在有效的放置目标上时被触发。
语法
addEventListener('drop', (event) => {});
ondrop = (event) => { };
属性
DragEvent.dataTransfer: 在进行拖放操作时，传输的数据。