如何检测敲击



情况:

带有子菜单的菜单。主菜单引用不同的页面,子菜单引用页面上的部分。

所以菜单看起来是这样的:

.menu-link
a(href="/") Homepage
#homepage-submenu.submenu
.submenu-link 
a(href="/#section1") Section1
.submenu-link 
a(href="/#section2") Section2
.menu-link
a(href="/otherPage") Other Page
#other-page-submenu.submenu
.submenu-link 
a(href="/#section1") Section1
.submenu-link 
a(href="/#section2") Section2

现在,子菜单最初被折叠。在"悬停";。菜单链接";子菜单被展开,它在任何有鼠标的机器上都能完美工作。

现在,在带有触摸屏的中型屏幕设备中,出现了一个问题,因为我无法使用悬停事件来初始显示菜单。此外,屏幕的大小会促使它的桌面版本显示出来。

因此,第一次点击必须展开菜单并抑制点击事件,第二次点击必须激活页面链接。

如何区分点击和点击我怎样才能检测到正在玩耍的老鼠


起初我以为我可以在";触摸启动";事件如果存在任何";触摸启动";在点击事件之前,我会第一次抑制它。

然而,似乎没有";触摸启动";铬事件不再出现在我的笔记本电脑上,也不再出现在平板电脑上?!哦!精灵!!11!11!!11!!!!!


下一个想法是检查任何";鼠标输入";或";鼠标移动";事件-那么我就知道有一只老鼠在玩。^^

然而,那些模拟的点击事件似乎总是产生这样的"点击";鼠标移动";以及";鼠标输入";在发射之前。

所以现在我完全不知道如何处理这样一个看似简单的情况。我认为几乎每个人都受到了影响,因为我认为这些情况非常常见,所以有人决定忽略触摸事件,实际上整个铬项目都完成了,这很奇怪;触摸启动";,它似乎不存在于至少两个触摸设备上(我用来测试的那些^^)。

我很震惊——现在这似乎真的是一个长期存在的bug。

修复方法是在"的主体上添加一个事件侦听器;触摸启动";事件

document.body.addEventListener("touchstart", () => return)

现在有了修复和";触摸启动";事件触发时,您可以通过"点击"的存在来区分点击和点击;触摸启动";事件