如何使用 JavaScript 检测触摸移出节点。
我正在使用phonegap 构建一个Android 应用程序。我正在尝试在用户触摸元素时实现触摸移动事件。但我还是没能做到完美。
触摸移动事件工作完美,但是当我触摸该区域并将手指拖动到另一个触摸区域时,没有事件触发。
所以要点是:- 用户触摸页面中的一个元素;然后将手指移出元素的范围。我想捕获手指移出元素时的事件。当它进入另一个触摸区域时,触摸移动功能应该再次触发。
谢谢
I am building an android app with phonegap. I am trying to implement a touch move event when user touches as element. But I am still not been able to make it perfect.
Touch move event works perfect but when I touches that area and drag my finger to another touch area no event is firing.
so in gist :-
User touches one element in the page; then move finger out of the scope of the element. I want to catch the event when the finger is moved out of the element. And when it enters another touch area the touch move function should fire again.
Thanks
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
也许您应该在您的问题中添加一个 javascript 标签,以获得更多关注。
据我所知,没有浏览器支持“mouseout”或“mouseover”等触摸事件。
所以我们必须自己跟踪这一点。由于我们获得的触摸对象(当触发触摸事件时)仅提供触摸事件开始的目标,因此我们必须使用触摸位置来检查我们正在触摸哪个元素。
我为此使用了 document.elementPosition(x, y) 。
因此,通过触摸事件的坐标,我们可以获得我们正在触摸的元素。
为了识别离开某个元素,我将存储最后触摸的元素并检查新的触摸事件(如果我仍在触摸同一个元素)。如果不是这种情况,我们就留下旧的,可以处理这个问题。
我写了一个简短的演示(jsbin)。 您可以在手机上尝试。
源代码也可以在此处找到。
此演示中缺少的是对预期触摸区域之外的触摸事件的处理。
我想知道是否有更好的方法来处理你的任务。如果是这样,希望有人能在这里写下来。自从您将问题添加到此处后,也许您已找到问题的答案?
Maybe you should had added a javascript tag to your question for getting more attention for it.
As far as I know no browser supports an event like "mouseout" or "mouseover" for touch events.
So we have to keep track of that ourselves. Since the touch object we get (when a touch event is fired) only provides the target the touch event started on, we have to check which element we're touching by using the touch position.
I used
document.elementPosition(x, y)
for that.So with the coordinates of the the touch event we can get the element we're touching.
To recognize leaving an element, I'm storing the last touched element and checking on new touch events, if I'm still touching the same one. If this isn't the case, we're left the old one and can deal with that.
I wrote a short demo (jsbin). You can try it here on your phone.
Source code can be also found here.
What's missing in this demo is a handling for touch events outside of the expected touch area.
I'm wondering if there is a better way to handle your task. If so, hopefully someone will write it down here. Maybe you have found an answer for your question since you added it here?