JavaScript cómo comprobar el agente de usuario para Mobile / Tablet
Actualmente estoy desarrollando algunos trabajos de JS para un sitio web de clientes que tiene diferentes funcionalidades en plataformas de escritorio y tabletas. Considerar:
if(! navigator.userAgent.match(/Android/i) && ! navigator.userAgent.match(/webOS/i) && ! navigator.userAgent.match(/iPhone/i) && ! navigator.userAgent.match(/iPod/i) && ! navigator.userAgent.match(/iPad/i) && ! navigator.userAgent.match(/Blackberry/i) ) { // do desktop stuff } else if ( navigator.userAgent.match(/iPad/i) ) { // do tablet stuff }
Actualmente, estoy comprobando solamente para el iPad como comprobar para "androide" parece algo problemático, y es un término muy amplio. ¿Existe un método conocido para distinguir entre Android tablet y móvil con JS?
- Archos 101 internet tablet: ¿Es posible ocultar los botones predeterminados de Android (software)
- Controlador para la depuración USB en un ASUS Memo Pad FHD 10 (ME302KL) en Windows 7
- Desarrollo para la tableta Android, con la tableta física
- El menú de opciones de onCreate no se muestra en android 3.1
- Android ADB no ve el dispositivo
Muchas gracias, Myles
- ¿Es posible instalar Eclipse IDE en una pestaña Galaxy?
- Emuladores de tablets en línea para Android
- ¿Dónde está el controlador ADB de Windows para el C de píxeles?
- Nuevo NavigationDrawer en tabletas con disposición fija a la izquierda
- ¿Cómo puedo reflejar la salida sólo en dispositivos compatibles con HDCP?
- ¿Cómo saber si su una tableta o un teléfono en android programmatically?
- Hacer que la aplicación de Android no esté disponible para tablets
- ¿Cómo hacer que la aplicación android esté disponible para tablets y pre 11 sdk?
Primero: mejorar la condición
if (navigator.userAgent.match(/iPad/i)) { // do tablet stuff } else if(navigator.userAgent.match(/Android|webOS|iPhone|iPod|Blackberry/i) ) { // do mobile stuff } else { // do desktop stuff }
En segundo lugar, añadiendo las palabras clave que faltan:
if (navigator.userAgent.match(/Tablet|iPad/i)) { // do tablet stuff } else if(navigator.userAgent.match(/Mobile|Windows Phone|Lumia|Android|webOS|iPhone|iPod|Blackberry|PlayBook|BB10|Opera Mini|\bCrMo\/|Opera Mobi/i) ) { // do mobile stuff } else { // do desktop stuff }
Y en tercer lugar, este es el script de detección real que uso:
https://jsfiddle.net/oriadam/ncb4n882/
var ua = navigator.userAgent, browser = /Edge\/\d+/.test(ua) ? 'ed' : /MSIE 9/.test(ua) ? 'ie9' : /MSIE 10/.test(ua) ? 'ie10' : /MSIE 11/.test(ua) ? 'ie11' : /MSIE\s\d/.test(ua) ? 'ie?' : /rv\:11/.test(ua) ? 'ie11' : /Firefox\W\d/.test(ua) ? 'ff' : /Chrome\W\d/.test(ua) ? 'gc' : /Chromium\W\d/.test(ua) ? 'oc' : /\bSafari\W\d/.test(ua) ? 'sa' : /\bOpera\W\d/.test(ua) ? 'op' : /\bOPR\W\d/i.test(ua) ? 'op' : typeof MSPointerEvent !== 'undefined' ? 'ie?' : '', os = /Windows NT 10/.test(ua) ? "win10" : /Windows NT 6\.0/.test(ua) ? "winvista" : /Windows NT 6\.1/.test(ua) ? "win7" : /Windows NT 6\.\d/.test(ua) ? "win8" : /Windows NT 5\.1/.test(ua) ? "winxp" : /Windows NT [1-5]\./.test(ua) ? "winnt" : /Mac/.test(ua) ? "mac" : /Linux/.test(ua) ? "linux" : /X11/.test(ua) ? "nix" : "", mobile = /IEMobile|Windows Phone|Lumia/i.test(ua) ? 'w' : /iPhone|iP[oa]d/.test(ua) ? 'i' : /Android/.test(ua) ? 'a' : /BlackBerry|PlayBook|BB10/.test(ua) ? 'b' : /Mobile Safari/.test(ua) ? 's' : /webOS|Mobile|Tablet|Opera Mini|\bCrMo\/|Opera Mobi/i.test(ua) ? 1 : 0, tablet = /Tablet|iPad/i.test(ua), touch = 'ontouchstart' in document.documentElement;
EDITAR:
Tenga en cuenta que las tabletas y iPads se consideran mobile
y tablet
. Tenga en cuenta que hay computadoras portátiles con toque, ratón y teclado. En otras palabras, un buen programador no depende del touch
, sino que soporta los tres métodos de entrada en todos los casos.
- Android ViewPager con imágenes: pérdida de memoria / fallos de la aplicación
- ¿Soporta Android Studio Maven?