4

我正在尝试使用 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 上，在 touchstart 上，反馈显示“mousedown at undefined, undefined”。如果我用 .pageX 和 .pageY 替换 .offsetX 和 .offsetY，那么我会得到实际坐标。因此，Safari Mobile 似乎不处理 .offsetX 和 .offsetY，但它确实处理了 .pageX 和 .pageY。

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

非常感谢任何帮助！

4

2 回答 2

0

在元素上使用 jQuery 的.on函数绑定事件处理程序时遇到了类似的问题canvas（不知道原因）。

我通过使用绑定事件处理程序解决了它addEventListener。处理程序中的event对象具有使用适当值定义的 offsetX 和 offsetY。

希望能帮助到你...

于 2014-06-06T09:56:35.597 回答
0

您可以使用clientXandclientY代替。

于 2012-10-08T08:59:40.830 回答