2012-02-24 7 views
8

En el pasado, el mejor método para verificar la presencia de un mouse era buscar touch event support. Sin embargo, Chrome de escritorio ahora admite eventos táctiles, lo que hace que esta prueba falle.¿Cómo puedo determinar de manera confiable si un navegador admite eventos de mouse over?

¿Hay alguna manera de probar directamente el soporte de evento de mouseover, en lugar de inferirlo en función de la presencia de eventos táctiles?

Resolución: Aquí está el código que funcionó, basado en la respuesta de AshleysBrain.

jQuery(function() 
{ 
    // Has mouse 
    jQuery("body").one("mousemove", function(e) 
    { 
     attachMouseEvents(); 
    }); 

    // Has touchscreen 
    jQuery("body").one("touchstart", function(e) 
    { 
     // Unbind the mouse detector, as this will fire on some touch devices. Touchstart should always fire first. 
     jQuery("body").unbind("mousemove"); 

     attachTouchEvents(); 
    }); 
}); 
+0

Gran! Intentó con el libro de jugadas (RIM OS), y funciona bien por primera vez, pero en la actualización de la página, detecta mousemove (!?). Sin embargo, adjuntar la prueba a algún #id en lugar de cuerpo funciona perfectamente. – MaxD

Respuesta

5

que podría hacer lo contrario de la solución para detecting keyboard or touch input. Simplemente espere un evento táctil real o un evento de movimiento del mouse y decida en función de eso. Si comprueba la presencia de un controlador de eventos, el navegador puede indicar que tiene el evento, incluso si no se está ejecutando en el hardware que lo soporta, por lo que lo único confiable es esperar y ver qué eventos reales se activan.

+0

Aunque me gustaría que hubiera una manera más limpia de hacerlo, esta resultó ser la solución que funcionó. Estoy publicando mi código en la pregunta para la posteridad. ¡Gracias por tu ayuda! –

-1

Si los sitios web pueden detectar que estás usando un navegador móvil con la mayor precisión lo hacen ¿por qué no se puede utilizar la misma técnica para inferir que no tienen apoyo al pasar el ratón?

+0

¿Qué pasa si se trata de una tableta de Android con un mouse adjunto (que se puede hacer)? Estoy buscando una solución a prueba de futuro específica para eventos de mouse. (Ya tengo los hacks en lugar de buscar Chrome y los dispositivos móviles basados ​​en el agente de usuario, pero los agentes de usuario no siempre son confiables.) –

+0

¡Yikes, no sabía que las tabletas Android tenían una opción de conexión de mouse! –

+0

Loco, ¿verdad? Es un caso extremo, pero si conectas un mouse a un Android con un puerto USB, funciona. –

1

Es posible que desee considerar el uso de Modernizr, se podría hacer algo como lo siguiente usando el método Modernizer.hasEvent() (docs):

Modernizr.hasEvent("mouseover", document); 
+0

No quería la sobrecarga de todo Modernizr para esta tarea específica, pero pude cortar la función isEventSupported y modificarla para hacer lo que necesitaba. ¡Gracias! –

+0

Hablé demasiado pronto. Modernizr.hasEvent ("mouseover") se evalúa como verdadero en el iPhone. –

0

He intentado esto y es el trabajo.

<html> 
<head> 
    <script type="text/javascript"> 
     function isEventSupported(eventName) { 
      var el = document.createElement("body"[eventName] || "div"); 
      var isSupported = "on" + eventName.toLowerCase() in el || top.Event && typeof top.Event == "object" && eventName.toUpperCase() in top.Event; 
      el = null; 
      return isSupported; 
     } 
    </script> 
</head> 

<body onload="alert(isEventSupported('mouseover'));">TEST mouseover event</body> 
</html> 

Tomé la función de isEventSupportedhttp://www.strictly-software.com/eventsupport.htm

+0

Esta solución debería funcionar, pero si prueba este código en un iPhone, todavía se evalúa como verdadero. Sospecho que los eventos táctiles son capaces de activar foco/mouseover bajo el capó, y MobileSafari ve ese evento como presente aunque no haya mouse. –

Cuestiones relacionadas