我想知道如何使用 'enddrop' 事件侦听器来更改元素的位置。
我试过用这个：
document.addEventListener('dragend', e => {
e.target.style.left = e.clientX;
e.target.style.top = e.clientY;
});
这可行，但它看起来不自然，因为元素左上角的坐标已更改为鼠标位置。因此，如果用户将元素拖动到左上角，它将完美地工作，但如果您拖动元素上的任何其他位置，它会给它一个活泼的效果，因为左上角会捕捉到鼠标的位置。
谢谢！
【问题讨论】：
标签： javascript html drag-and-drop draggable
我最近解决了一个类似的问题：
点击链接：Prevent drop event when it's already have child element ? Drag and Drop
在您开始拖动（dragstart）的那一刻，您会根据元素和鼠标位置计算顶部和左侧的偏移量 并在最后的 drag(dragend) 事件中使用此偏移量来根据需要进行调整。
let offset = [0, 0] // initial state offset x, y
function dragStart(ev) {
// your code..
offsetX = ev.target.offsetLeft - ev.clientX
ev.target.offsetLeft - ev.clientX,
ev.target.offsetTop - ev.clientY
]
}
有疑问把代码放上来，我可以帮你。
希望这会有所帮助。
【讨论】：