DragEvent

Baseline 已广泛支持

此功能已成熟,并可在许多设备和浏览器版本上使用。自 2020 年 9 月起,所有浏览器均已提供此功能。

DragEvent 接口是一个 DOM 事件,用于表示拖放交互。用户通过将指针设备(如鼠标)置于触摸表面,然后将指针拖动到新位置(如另一个 DOM 元素)来发起拖动。应用程序可以自由地以应用程序特有的方式解释拖放交互。

此接口继承自 MouseEventEvent 的属性。

Event UIEvent MouseEvent DragEvent

实例属性

DragEvent.dataTransfer 只读

在拖放交互期间传输的数据。

构造函数

虽然此接口有一个构造函数,但无法通过脚本创建有用的 DataTransfer 对象,因为 DataTransfer 对象具有由浏览器在拖放期间协调处理的安全模型。

DragEvent()

创建一个合成的、不可信的 DragEvent。

事件类型

drag

当一个元素或文本选择正在被拖动时,会触发此事件。

dragend

当拖动操作结束时(通过释放鼠标按钮或按 Escape 键),会触发此事件。

dragenter

当一个被拖动的元素或文本选择进入一个有效的放置目标时,会触发此事件。

dragleave

当一个被拖动的元素或文本选择离开一个有效的放置目标时,会触发此事件。

dragover

当一个元素或文本选择正在被拖动且鼠标指针位于一个有效的放置目标上方时,此事件会连续触发(鼠标不移动时每 50 毫秒触发一次,否则在 5 毫秒(缓慢移动)和 1 毫秒(快速移动)之间触发,大约如此。此触发模式与 mouseover 不同)。

dragstart

当用户开始拖动一个元素或文本选择时,会触发此事件。

drop

当一个元素或文本选择被放置在一个有效的放置目标上时,会触发此事件。

示例

每个属性、构造函数、事件类型和全局事件处理程序的示例都包含在其各自的参考页面中。

规范

规范
HTML
# dragevent-interface

浏览器兼容性

另见