是否可以通过触摸事件实现“enter”事件检测?

问题描述 投票:0回答:2

我有要求执行以下操作

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

我已经用

onmousedown
onmouseenter
onmouseleave
很好地实现了这一点,在我处理最后一步的文档中添加了
onmouseup

问题是,我需要它在移动设备上工作。我已经成功地使用

div
touchstart
组合来实现拖动
touchmove
,而且非常简单。现在我尝试实现上述行为,但我发现,

  • 不再存在
    touchenter
    touchleave
    事件,并且
    touchmove
    显然仅在目标已经发生
    touchstart
    事件时才会触发。

令人沮丧的是,没有无缝的方法可以做到这一点,我确实知道触摸设备与鼠标不同,但我认为应该对待一些常见的行为没有太大区别,并且只区别对待每个设备的特殊事物设备有。

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

根据评论中的要求,这是我的网格

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

<table>

javascript mouseevent touch-event
2个回答
1
投票

我的最终解决方案是在容器(

表体
)上添加一个touchmove监听器,然后使用
elementFromPoint()
手动触发给定元素的事件。

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

touchleave


0
投票

不同之处在于,使用

mousedown
时,单击鼠标时会触发单个事件,而使用
touchstart
时,每次触摸进入新元素时都会触发一个事件(即,如果您触摸屏幕并滑动手指)在不将手指移开的情况下进入 div 时,将触发两个
touchstart
事件 - 一个与原始触摸元素相关,另一个在触摸进入 div 时触发)。

解决方案是像处理

touchstart
那样处理
mouseenter

© www.soinside.com 2019 - 2024. All rights reserved.