一种检测mouseenter vs touch click的方法？使用 Modernizr 怎么样？答案

【问题标题】：A way to detect mouseenter vs touch click? How about using Modernizr?一种检测mouseenter vs touch click的方法？使用 Modernizr 怎么样？
【发布时间】：2018-05-27 13:56:59
【问题描述】：

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

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)') 看看我是否可以将桌子和移动设备与电脑屏幕分开，但它不适用于显示桌面视图但只能使用触摸功能的大型平板设备。救命~！

【问题讨论】：

标签： mobile hover touch mouselistener modernizr

【解决方案1】：

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

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

【讨论】：