检测触摸屏桌面

Question

我的最终愿望是允许使用触摸屏桌面的用户（不带鼠标或键盘的一体机）在使用工具提示的网站上导航。使用鼠标悬停在工具提示上打开它，工具提示包含可点击的链接。使用触摸屏，没有悬停，只有'触摸'/点击。在这两种情况下，一旦用户有鼠标，另一次用户有触摸屏，页面将使用相同的浏览器显示在同一操作系统上。

所以我需要区分两者：一台带鼠标的台式电脑和一台没有鼠标的触摸屏台式电脑。 Modernizr touch测试（http://modernizr.github.com/Modernizr/touch.html）在触摸屏桌面上完全失败（http://shop.lenovo.com/us/landing_pages/thinkcentre/2010/m90z）。嗅探UA或浏览器也不起作用。

（相当数量的搜索后，所有检测试图区分不同版本的手机或平板电脑，浏览器，用户代理...正在使用同一个浏览器在相同的操作系统上运行的不是台式机的触摸屏。）

任何想法？

Answer 1

将事件监听器touchstart和mousemove添加到您的页面，然后等待用户开始与您的页面进行交互。如果第一个事件是mousemove，那么用户使用鼠标操作，所以它可能是一个桌面，否则这是一个触摸屏。

$(document).on('touchstart.desktopDetect mousemove.desktopDetect', function(ev) { 
    window.IS_TOUCHSCREEN_DEVICE = (ev.type == 'touchstart'); 
    $(document).off('.desktopDetect'); 
}); 

检查工作示例这里： https://jsfiddle.net/evpozdniakov/uvb51cnm/embedded/result/