既没有鼠标也没有指针,悬停屏幕元素的概念并不适用于触摸设备.许多网站依赖于
JavaScript悬停事件导航或其他目的,一些触摸设备1实现鼠标点击一次点击即可触发.如果一个事件处理程序也绑定到该点击,这只会在元素上的第二个点击上提出.
由于jQuery的hover()函数在内部使用mouseenter和mouseleave,所以与hover()和click()注册的元素需要两个抽头才能触发后者2.对于很多用例,这正是你想要发生的事情.然而,在hover()处理仅将重点(工具提示,发光等)添加到悬停元素的应用程序中,跳过所有事件的触摸设备可能会更有意义,并将其转到onclick处理程序.
我知道如何专门聆听touchstate和touchend事件,让我量身定制触控用户体验.这是我问题的有效解决方案,但我希望这可能是一个“更容易”的方式.我想象的是一个类似于它的签名中的hover()的方法,只有这样一种方式才能将提供的事件处理程序附加在非触摸设备上.
jQuery有这样的方法吗?任何插件?还是我忽略了这里的东西?
1行为在iPad,iPhone和几款Android手机上得到证实.
2
在桌面vs触摸设备上运行这个JsFiddle demo,看看我在说什么.
解决方法
我建议使用Modernizr来检测设备的触感,只是不绑定悬停处理程序,除非html元素具有“no-touch”类:
$('selector').click(...) $('.no-touch selector').hover(...)
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。