Javascript 获取当前元素上的touchstart坐标
我有一个元素,看起来像这样:Javascript 获取当前元素上的touchstart坐标,javascript,html,Javascript,Html,我有一个元素,看起来像这样: ____________________________________ / \ | | | | +------------------------------------+ | | |
____________________________________
/ \
| |
| |
+------------------------------------+
| |
| |
| |
+------------------------------------+
| |
| |
\____________________________________/
other_options.addEventListener('touchstart', function(e) {
event.preventDefault();
}, false);
我已将touchstart侦听器连接到它,如下所示:
____________________________________
/ \
| |
| |
+------------------------------------+
| |
| |
| |
+------------------------------------+
| |
| |
\____________________________________/
other_options.addEventListener('touchstart', function(e) {
event.preventDefault();
}, false);
我想做什么,我已经看过了“e”的值,但我找不到任何足够一致的值(当我尝试这些值时,它们对我来说似乎不正确)来做我想做的事情
我知道那些排的大小。我只希望能够获取触发touchstart事件的Y坐标,即元素的上坐标0。这样,Math.floor(y/行大小)将为我提供启动touchstart事件的行。您必须这样访问
e.touches[0].clientX/clientY.
可通过e.touchs访问触摸屏的数量和触摸信息
看看这个常见问题
这里是触摸事件
顺便说一下,事件将仅返回相对于窗口的x/y坐标。我们不能改变这一点。你能做什么<代码>顶部=0-element.top;x=clientx top。最好使用
getBoundingClientRect()
方法来计算元素的顶部和左侧值
如果元素位于另一个容器中,则上述方法,element.top
,可能不会给出相对于视口的顶部和左侧值
因此,要计算相对于元素的触摸坐标,我们可以做如下操作
var rect = element.getBoundingClientRect();
xCoordinate = event.touches[0].clientX - rect.left;
yCoordinate = event.touches[0].clientY - rect.top;
要了解有关
getBoundingClientRect()
方法的更多信息,.它给了我一个坐标,但我希望有一个相对坐标(当我到达元素顶部时,y=0,它实际上给了我161,可能是因为边距)。有没有办法让我至少知道真正的上限位置,这样我就可以用减法在顶部得到一个0?你能不能创建一个JSFIDLE。我试试看,我还没怎么用过它。这会管用的,我的目标是,当点击红色元素的顶部时,我想要一个“0”,由于利润率或其他因素的影响,现在显示的不是100。谢谢你的时间,顺便说一句,我没有说这个,但我希望能够做到这一点,而不必知道元素距离顶部是95像素(否则我只需要硬编码a-95)