浏览器检测 - 移动与PC

因此，我已经阅读了少数关于浏览器检测和功能检测的主题，我并不完全确定我需要做的事情属于该讨论的范围。浏览器检测 - 移动与PC

我有一个游戏网站。人们可以在PC或移动设备上玩游戏。他们还可以配置他们希望游戏如何工作。例如，他们可以选择通过单击或双击来玩卡片。但是，双击不是移动设备上的一个选项，因此有些人会遇到问题，因为他们选择了该选项，而JavaScript无法正常工作。所以我想，我会让人们为移动设备指定一组偏好设置，为PC设置另一组偏好设置，并且只提供这些设备上可用的选项。然而，我正在阅读的是，检测PC与移动设备是一个糟糕的出路。

那么，如果我是特征检测，我究竟在检测什么？没有办法检测设备是否特别支持双击，是吗？

来源

2013-12-12 a2zCribbage

在我看来，你的问题是触摸用户界面与光标用户界面，这不一定与移动设备和PC（大概是桌面）相关。也许提供光标（或指点设备）的触摸和设置的设置，并让用户选择一个或另一个。 – RobG

所以我做到了这一点（理论上听起来正确），但在实践中我该如何去做呢？我尝试使用Modernizr.touch来识别某些浏览器是否支持触摸，并且它不起作用（或者我不期望它如何工作）。 – a2zCribbage

我有一个简单的触摸支持功能测试，我会在几个小时后发布。 – RobG

您将无法高效地检测到PC或移动设备访问您的网站的位置，因为存在许多设备并且它们不断变化。唯一的方法是检查浏览器代理字符串，它非常繁琐;有成千上万的。此外，它可能被欺骗，所以它不是一个很好的信息来源。你可以做的最好的（这是许多专业人士，包括我）使用的功能检测技术 - 屏幕分辨率，支持html标签，支持的CSS属性等。

一个很好的工具是Modenizr js库，这是功能并且你可以检查设备是否支持触摸事件，如果有，那么你知道双击不会是你的选择。

下面是一些文档的链接http://modernizr.com/docs/#features-misc

来源

2013-12-12 02:52:36 Leo

如果可以的话，我会投下来，但我没有声望。我去了Modernizr，并且实施了触摸功能检测，现在我和我的网站在一个非常糟糕的地方。它不工作！有很多人在我的网站上使用计算机，而modernizr则说他们使用的是触摸式设备，但事实上并非如此。我强烈建议人们避免使用Modernizr进行触摸检测！ – a2zCribbage

下面是一个例子。这个浏览器/操作系统组合返回“真”的触摸，但它不是一个触摸设备（据我所知）:(Windows NT 6。2; WOW64）AppleWebKit/537.36（KHTML，像Gecko）Chrome/31.0.1650.57 Safari/537.36 – a2zCribbage

好吧，公平地说，我猜测Modernizr做的是正确的事情，我只是问了一个错误的问题。我认为（不正确），有触摸设备意味着你不能使用双击。实际上，一些设备支持这两种设备。我真正应该做的是不检测触摸设备（正如本答案所建议的那样），而是检测设备是否支持双击。这个陈述（以及我的想法呢！）在上面的答案中是不正确的“如果确实如此，那么你知道双击不会成为你的选择。”因为有些设备同时支持。 – a2zCribbage

看来你真的想要做的是测试支持触控，尝试Detecting touch: it’s the ‘why’, not the ‘how’。

一个共同的建议是：

if (document && document.element && 'ontouchstart' in document.documentElement) { 
    ... 
}

但是，很可能在某些浏览器中失败。较长的方法，虽然可能没有更准确，是测试活动的支持直接：

/* Feature tests for TouchEvent and GestureEvent modules 
    * implemented in Mobile Safari on iPhone 
    * 
    * The TouchEvent module is a draft (18/08/2008) that supports: 
    * 
    * touchstart 
    * touchmove 
    * touchend 
    * touchcancel 
    * 
    * The GestureEvent module is a draft (18/08/2008) 
    * that supports: 
    * 
    * gesturestart 
    * gesturechange 
    * gestureend 
    * 
    * The functions require support for try..catch, introduced 
    * in ECMA-262 ed3, JavaScript 1.4 and JScript 5.1.5010. 
    * Equates to Navigator 4.0 or later and IE 5.1 or later 
    * (http://pointedears.de/scripts/es-matrix/) 
    * 
    * If W3C DOM 2 Event document.createEvent is supported, 
    * return either true or false, 
    * otherwise return undefined. 
    */ 
    function touchSupported() { 
    if (document && document.createEvent) { 
     try { 
     document.createEvent('TouchEvent'); 
     return true; 
     } catch (e) { 
     return false; 
     } 
    } 
    } 

    function gestureSupported() { 
    if (document && document.createEvent) { 
     try { 
     document.createEvent('GestureEvent'); 
     return true; 
     } catch (e) { 
     return false; 
     } 
    } 
    }

这是写在2008年，我才真正用它在Safari和iPhone虽然它似乎在其他地方工作。彻底测试。

来源

2013-12-16 13:49:45 RobG

浏览器检测 - 移动与PC

回答

相关问题