javascript - evt.offsetX 在 Safari 上返回 undefined

Question

我正在尝试使用 Javascript 在 SVG 元素上执行拖动/移动操作。我正在使用这样的事件处理程序:

function handleMouseDown(evt) {
            currentX = evt.offsetX;
            currentY = evt.offsetY;
            dX = currentX - Number($(evt.srcElement).attr("x"));
            dY = currentY - Number($(evt.srcElement).attr("y"));
            isDragging = true;
            $info.html("mousedown at " + currentX + ", " + currentY); //feedback for debugging
        }

请注意，我已经有代码将 mousedown 或 touchstart 指向 handleMouseDown，具体取决于它是否是触摸设备。

在我的桌面上，代码在 IE9、Google 和 Safari 上运行良好。但是在 iPad 上，在触摸启动时，反馈显示“鼠标按下未定义，未定义”。如果我将 .offsetX 和 .offsetY 替换为 .pageX 和 .pageY，那么我将获得实际坐标。所以 Safari Mobile 似乎不处理 .offsetX 和 .offsetY，但它确实处理 .pageX 和 .pageY。

我知道我可以使用源元素的 position.left 属性从 pageX 计算 .offsetX，但我想尽可能避免这种情况。所以我的问题是:我的代码或方法是否有问题，或者 .offsetX 是否未在 Safari Mobile 中处理。

非常感谢任何帮助!

Answer 1

您可以改用 clientX 和 clientY。