4

我正在使用 jquery.hammer.js 编写一个小页面,但在获取触摸事件的 x 和 y 坐标时遇到问题。

我的代码如下:

var x1, y1;
var element = document.getElementById("myDIV")
$(element).hammer().on("touch", function(e){
x1 = e.clientX
y1 = e.clientY

document.getElementById("resultDIV").innerHTML = x1 + " " + y1
}

但我得到的只是“未定义的未定义”作为我的结果。

我有我能想到的一切,非常感谢任何帮助。

4

4 回答 4

11

e.gesture现在已弃用。使用最新版本的 Hammer.js,您应该使用

var tapX, tapY;
tapX = e.center.x;
tapY = e.center.y;
于 2014-08-17T17:00:42.667 回答
8
  1. 你错过);了最后。
  2. 尝试始终;在每个结尾使用分号 () statement
  3. 如果您开始使用某些库,请先阅读文档和操作方法部分。

您可以从GitHub 上的文档中找到您想要的信息。

更新:
我分析了event对象并找到了gesture该对象的属性。包含另一个属性,gesture称为center. pageX最后,您可以使用and从此属性中获取 X 和 Y 坐标pageY

var x1, y1;
x1 = e.gesture.center.pageX;
y1 = e.gesture.center.pageY;

这是您在JSFiddle中的示例的工作演示。

而且如果你使用,你可以通过使用属性数组multi-touch来获取每次触摸的坐标。其他属性名称保持不变 ( )。touchesgesturepageX, pageY

var x1, y1;
x1 = e.gesture.touches[0].pageX;
y1 = e.gesture.touches[0].pageY;

这是您的示例的第二个演示,它使用touches数组仅获取第一次触摸的坐标。

于 2013-07-01T07:34:15.100 回答
2

我需要调查原始事件才能让我的工作。这是其他有类似情况的人的示例。

$("#id").hammer({ domEvents: true }).on("press", ".elems", function (e) {
    console.log("pressed");
    console.log(e.originalEvent.gesture.center.x);
    console.log(e.originalEvent.gesture.center.y);
    return false;
});

锤子版Hammer.JS - v2.0.4 - 2014-09-28

于 2014-12-08T22:55:17.803 回答
0

在hammerjs中2.0.8我使用ev.srcEvent.offsetXev.srcEvent.offsetY

于 2019-03-14T17:12:17.093 回答