¿Cómo verificar el navegador para el soporte de inicio con JS/jQuery?

En un intento de seguir las mejores prácticas, estamos tratando de utilizar los eventos adecuados de JavaScript/jQuery según el dispositivo que esté utilizando. Por ejemplo, estamos creando un sitio móvil que tiene una etiqueta que tendrá un evento onclick o touch. En el caso de un iPhone, nos gustaría usar el evento "touchstart". Nos gustaría probar si su dispositivo es compatible con "touchstart" antes de vincular ese controlador al objeto. Si no es así, enlazaremos "onclick" en su lugar.¿Cómo verificar el navegador para el soporte de inicio con JS/jQuery?

¿Cuál es la mejor manera de hacerlo?

Fuente

2010-05-26 Alex

Puede detectar si el evento es apoyado por:

if ('ontouchstart' in document.documentElement) { 
    //... 
}

Dale un vistazo a este artículo:

Detecting event support without browser sniffing

La función isEventSupported publicada allí, es realmente bueno para detectar una gran variedad de eventos, y es un navegador cruzado.

Fuente

2010-05-26 19:03:42 CMS

Estoy como tentado a 1 esto, pero sé que Firefox devolverá FALSE aquí para las razones equivocadas. Firefox devuelve falso para todos los eventos marcados de esta manera (lo sé, es una de esas situaciones raras donde Fx apesta). El artículo entra en eso, así que obtienes tu +1 ;-) –

gran recurso. ¡Gracias por la rápida ayuda! – Alex

+15

Esto solo detecta si el ** navegador ** admite eventos táctiles, pero no determina si el ** dispositivo ** los admite. Prueba esto en Chrome en un dispositivo sin contacto. – RobG

se puede comprobar si typeof document.body.ontouchstart == "undefined" a caer de nuevo a eventos DOM normales

Fuente

2010-05-26 19:05:57 antimatter15

hice una demostración completa que funciona en todos los navegadores con el código fuente completo de la solución de este problema: Detect touch screen devices in Javascript.

Fuente

2011-05-12 03:09:34

Pensé que era un buen ejemplo. gracias por compartir. – zipzit

Su ejemplo produce muchos falsos positivos. Hay muchos navegadores que implementan la API táctil de forma predeterminada, ya sea que los dispositivos táctiles estén o no conectados al sistema. – Nilpo

@Nilpo Quizás tengas razón. Esta publicación fue escrita hace más de siete años. –

Utilice este código para detectar si el dispositivo admite el toque.

también trabajar para Windows 8 IE10 que utiliza evento 'MSPointerDown' en lugar de 'touchmove'

var supportsTouch = false; 
if ('ontouchstart' in window) { 
    //iOS & android 
    supportsTouch = true; 

} else if(window.navigator.msPointerEnabled) { 

    // Windows 
    // To test for touch capable hardware 
    if(navigator.msMaxTouchPoints) { 
     supportsTouch = true; 
    } 

}

Fuente

2013-01-14 14:44:11

¿Por qué no simplificarlo como un trazador de líneas? '' var supportsTouch = ('ontouchstart' en la ventana || window.navigator.msPointerEnabled) '' –

Desafortunadamente, esto no funciona para, por ejemplo, 11 en Windows 10 en la computadora portátil HP (sin pantalla táctil) para mí. Dice erróneamente supportsTouch = verdadero. pero cuando enlazo algo a "touchstart", nunca se ejecuta. De cualquier forma alrededor de esto? –

Esto es simplemente incorrecto.La API de punteros se aplica a algo más que a los dispositivos táctiles. Se aplica a prácticamente todos los dispositivos de entrada. – Nilpo

¿Cómo verificar el navegador para el soporte de inicio con JS/jQuery?

Respuesta

Cuestiones relacionadas