javascript - 模拟 Android 浏览器中触摸事件的悬停行为

Question

我的 Wordpress website正在使用 Superfish 1.5.4呈现菜单项。

我的菜单由许多父菜单项组成，它们也是可点击的页面，将鼠标悬停在这些父项上时，应该会出现子菜单项

当鼠标悬停在我的 PC 浏览器中的父菜单项上时，会出现子菜单项，这是预期的行为。

在 iPhone 浏览器中，当触摸父菜单项时，会出现子菜单项，这也是首选行为。 (所以这有效地触发了悬停行为)

问题在于，在 Android 设备上，触摸父菜单项会导致点击事件，这与我们在 iPhone 上看到的悬停行为相反。

我查看了 Superfish JavaScript，但没有看到任何特定于 iPhone 的逻辑。

因此，我想知道为什么在 iPhone 中触摸会导致悬停行为，但在 Android 设备中却不会。

我在这里错过了什么？

Answer 1

问题本质上是 :hover 功能在触摸设备上并不存在(假设没有像鼠标那样的物理悬停方式)。您在 iPhone 上获得预期效果的唯一原因是使用 iOS 的设备会在点击事件之前触发 :hover 事件，因此您将在页面更改之前的短暂时间内看到预期的样式。对此确实没有任何好的解决方案，特别是对于像您这样带有子菜单的菜单，但我会查看一些资源，例如 this 以便更好地了解问题及其“解决”的可能方法。