想知道html5拖放的dragover和dragenter事件的区别

Question

我想知道html5拖放的dragover和dragenter事件的区别.我不清楚这种差异.

Answer 1

这很简单,dragenter事件发生在你将某些内容拖入目标元素的那一刻,然后它就会停止.dragover事件发生在你拖动东西的时候,直到你丢弃它为止.

看这里:

$('.dropzone').on("dragover", function (event) {
    console.log('dragover');
});
$('.dropzone').on("dragenter", function (event) {
    console.log('dragenter');
});

现在看到控制台:

正如您所看到的那样,dragenter发生一次(当您将元素拖入目标时).

但是,每隔几百毫秒就会发生一次事件.

drag和dragstart之间存在相同的差异,dragstart发生一次,但每隔几百毫秒就会发生一次拖拽.

Answer 2

基于dragenter和dragoverMDN文档......

的dragover

当元素或文本选择被拖动到有效的放置目标(每几百毫秒)时,将触发dragover事件.

的dragenter

当拖动的元素或文本选择进入有效的放置目标时,会触发dragenter事件.

本dragover是一个小的延迟后触发(每350毫秒,我认为),同时光标停留在元素.