javascript - 是否可以通过触摸事件实现 "enter"事件检测?

标签 javascript mouseevent touch-event

我有以下要求

  1. 用户点击屏幕上的一个方 block 。
  2. 因为它是一个网格,所以有相邻的方 block ,用户可以在不释放鼠标的情况下移动到相邻的方 block ,我需要检测鼠标进入这个新方 block 以激活下一个方 block ,在第一次移动之后,运动方向变得固定。
  3. 重复,直到释放鼠标,释放鼠标时,检查是否匹配,仅此而已。

我用 onmousedown 很好地实现了这一点, onmouseenteronmouseleave , 添加 onmouseup到我处理最后一步的文档。

问题是,我需要这个才能在移动设备上工作。我设法实现了拖动 div带有 touchstart , touchmove组合,这很简单。现在我试图实现上述行为,但我发现,

  • 不再存在 touchentertouchleave事件,那touchmove显然只有在目标已经有 touchstart 时才会触发事件。

令人沮丧的是,没有无缝的方式来做到这一点,我知道触摸设备与鼠标不同,但我认为有一些共同的行为应该没有太大区别对待,并且只区别对待特殊的东西每个设备都有。

如果有办法做到这一点,我真的很感激,因为我已经厌倦了阅读文档和尝试看似可以解决问题但实际上并没有解决问题的方法。

按照评论中的要求,这是我的网格 enter image description here

请注意,此网格不是静态的,也不是直接使用 HTML 创建的,它是从文件中提取并使用不同的程序生成的,它只是一个 <table> .

最佳答案

我最终的解决方案是在容器(表体)上添加一个touchmove监听器,然后使用elementFromPoint()触发手动给定元素的事件。

我跟踪触发事件的最后一个元素,以防止多次触发。如果需要,它还允许触发 touchleave

关于javascript - 是否可以通过触摸事件实现 "enter"事件检测?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42966392/

相关文章:

javascript - jQuery - Div 跟随 touchmove/mousemove + autoalign

javascript - 如何为背景网格实现每行删除

javascript - 为 AngularJS + Spring MVC 网站生成静态 SEO 页面

android - pygame - 将对象链接到鼠标事件

android - 在 Android 上拦截 Activity 和按钮上的触摸事件

javascript - 使用 scrollTop() 滚动时菜单闪烁

java - Java 上的取消按钮

JavaFX 鼠标拖动事件未触发

Android:检测圆形中的触摸事件

android - 在 Android 中逐个像素地跟踪运动