我编写了一个jQuery插件，可以在桌面和移动设备上使用。我想知道是否有一种方法可以用JavaScript来检测设备是否具有触摸屏功能。我使用jquery-mobile.js来检测触摸屏事件，它适用于iOS, Android等，但我也想根据用户的设备是否有触摸屏来编写条件语句。
这可能吗?
当前回答
有一种方法比检查他们是否拥有触摸屏更好，那就是检查他们是否正在使用触摸屏，而且这更容易检查。
if (window.addEventListener) {
var once = false;
window.addEventListener('touchstart', function(){
if (!once) {
once = true;
// Do what you need for touch-screens only
}
});
}
其他回答
$.support.touch ? "true" : "false";
更新2021
要查看以前的答案，请查看历史记录。我决定从头开始，因为在保存历史的时候，它变得难以控制。
我最初的回答是，使用与Modernizr使用的相同功能可能是一个好主意，但这不再有效，因为他们删除了这个PR: https://github.com/Modernizr/Modernizr/pull/2432上的“touchevents”测试，因为这是一个令人困惑的主题。
话虽如此，这应该是一个相当好的检测浏览器是否具有“触摸功能”的方法:
function isTouchDevice() {
return (('ontouchstart' in window) ||
(navigator.maxTouchPoints > 0) ||
(navigator.msMaxTouchPoints > 0));
}
但是对于比我更聪明的人写过的更高级的用例，我建议阅读这些文章:
斯图·考克斯:你无法检测触摸屏 触摸检测:它是“为什么”，而不是“如何” Patrick H. Lauke的敏感演讲
您可以使用以下代码:
function isTouchDevice() {
var el = document.createElement('div');
el.setAttribute('ongesturestart', 'return;'); // or try "ontouchstart"
return typeof el.ongesturestart === "function";
}
来源:detection touch-based browsing and @mplungjan post。
上述解决方案是基于检测事件的支持，没有浏览器嗅探文章。
您可以在下面的测试页面检查结果。
请注意，上面的代码只测试浏览器是否支持触摸，而不是设备本身。所以如果你的笔记本电脑有触摸屏，你的浏览器可能不支持触摸事件。最新的Chrome浏览器支持触摸事件，但其他浏览器可能不支持。
你也可以试试:
if (document.documentElement.ontouchmove) {
// ...
}
但它可能不适用于iPhone设备。
虽然它只是alpha版本，但jquery移动框架值得一试。它将在移动浏览器中规范化这些类型的事件。也许可以看看他们在做什么。我假设jquery-mobile.js与这个框架有所不同。
实际的答案似乎是一个考虑上下文的答案:
1)公共站点(无法登录) 编写UI代码以同时使用这两个选项。
2)登录站点 捕获登录表单上是否发生了鼠标移动，并将其保存到隐藏的输入中。该值与登录凭据一起传递，并添加到用户的会话中，因此可以在会话期间使用它。
Jquery只添加到登录页面:
$('#istouch').val(1); // <-- value will be submitted with login form
if (window.addEventListener) {
window.addEventListener('mousemove', function mouseMoveListener(){
// Update hidden input value to false, and stop listening
$('#istouch').val(0);
window.removeEventListener('mousemove', mouseMoveListener);
});
}
(@Dave Burt +1， @Martin Lantzsch +1)
