检测元素上的拖动位置

Detecting drag position on an element

本文关键字:拖动 位置 元素 检测      更新时间:2023-09-26

我正在构建一个wysiwyg编辑器来构建html电子邮件。我希望能够添加行布局的编辑器通过拖放。

如果一行被拖放到拖放目标的中点以上,我想在拖放目标之前添加一行;如果它被拖到中点以下,我想在拖放目标后追加一行。

有什么办法可以做到吗?

您可以使用getBoundingClientRect()来获取元素的坐标,而鼠标按钮按下并移动,就像这样

element.onClick = function() {
    element.onmousemove = function() {
        var x1 = element.getBoundingClientRect().left,
            x2 = x1 + element.getBoundingClientRect().width,
            y1 = element.getBoundingClientRect().top,
            y2 = element.getBoundingClientRect().height;
    }
}

现在你可以对这些坐标做任何你想做的事情