HTML5拖放时拖放图像偏移量

Question

我有一个draggable="true"元素，我将其放入放置区域。该事件给了我一些属性，我可以用它来确定它的位置并创建一个新的元素，它被丢弃。

似乎只给出鼠标位置。但它似乎并不包含图像相对于鼠标的偏移量。

我会从哪里获得这些信息？

图片有助于解释，鼠标位于黄点。 drop事件返回鼠标所在的event.x和event.y ....但我需要知道蓝点在哪里，或者偏移（红线）

Answer 1

html5原生DragEvent中有offsetX和offsetY属性。

例如在 React 中你可以通过 native 获取这些值

function onDragStart(event: React.DragEvent) {
    console.log(event.nativeEvent.offsetX)
    console.log(event.nativeEvent.offsetY)
}