一种检测mouseenter vs touch点击的方法？使用Modernizr怎么样？

Question

我需要找到一种方法来了解用户是否使用鼠标悬停或触摸单击来显示和隐藏不同的菜单链接。我想做的就是这个。

if(a user used a mouseenter or mouseleave){
       $("li.mobile-show > a").hide();
       $("div.hover-over").hover(function(){
            $(".hover-dropdown", this).children().slideToggle(); 
        });
}
else if(a user used touch click){
        $("li.mobile-show > a").show();     
        $("div.hover-over").click(function(){
            $(".hover-dropdown", this).children().toggle(); 
        });
}

我尝试了Modernizr.mq('only all and (min-width: 768px)')，看看我是否可以将桌面和移动设备与电脑屏幕分开，但它不适用于显示桌面视图但只能使用触摸功能的大型平板电脑设备。帮助〜！

Answer 1

这是一个老问题。不幸的是没有办法。没有与Modernizr，没有任何东西。

• 桌面浏览器（至少是主要浏览器）具有ontouchstart（'ontouchstart' in window）和整个Touch Events API。
• 移动浏览器模拟鼠标事件。
• 根据设备宽度/尺寸做出结论也容易出错：许多平板电脑的像素宽度为1280,1300和更多