2012-09-14 14 views
30

Estoy desarrollando una aplicación que se ejecuta en Android/iOS y computadoras de escritorio.¿Cuál es la diferencia entre los eventos de hacer clic y tocar?

¿Debo utilizar el evento click o tap?

¿Cuáles son las diferencias entre ellos?

¿Funcionará el 'tap' en el escritorio? si no, (y tengo que usar click) ¿me faltan las ventajas que el tap tiene sobre el click?

Respuesta

12

Los eventos táctiles y los eventos del mouse son bestias completamente diferentes. No son intercambiables.

Dicho esto, estoy usando jQuery Touch Punch que asigna eventos táctiles a sus análogos de eventos de mouse, por lo que un toque se convierte en lo mismo que un clic. Esto hace que sea posible usar toda la bondad de jQuery UI estándar sin tener que hacer ninguna programación especial de evento táctil. Es extremadamente simple de usar, y hasta ahora me ha funcionado perfectamente en iDevices y Android.

+6

¿Puede explicar en qué se diferencian? –

+0

@xn .: En primer lugar, mouseover, mousemove y mouseout son diferentes eventos de touchstart, touchmove y touchend. En segundo lugar, si bien logran muchos de los mismos resultados, las capacidades son ligeramente diferentes: no puede haber un mouse equivalente a multitouch, y "hacer clic y arrastrar" no se puede hacer con un dedo. Puede usar la herramienta que mencioné para asignar eventos táctiles a eventos de mouse equivalentes funcionalmente (aunque no físicamente). – ghoti

2

Me gustaría ver en la documentación JQM para Eventos, los documentos actuales están aquí:

durante los eventos del dispositivo móvil del tacto del uso, si es necesario eventos de ratón JQM ofrece ratón virtual eventos para esto también.

eventos virtuales ratón
Nos proporcionan un conjunto de eventos de ratón "virtuales" que intentan abstraer eventos de ratón y el tacto. Este permite al desarrollador registrar oyentes para los eventos básicos del mouse, como mousedown, mousemove, mouseup y click, y el complemento se encarga de registrar los oyentes correctos detrás de las escenas en invocar al oyente al mayor tiempo posible tiempo para ese dispositivo. En entornos táctiles , el complemento conserva el orden de activación del evento que se ve en entornos de mouse tradicionales, por ejemplo, vmouseup es siempre enviado antes de vmousedown y vmousedown antes de vclick, etc. Los eventos del mouse virtual también normalizan cómo se coordinan información se extrae del evento, por lo que en entornos táctiles , las coordenadas están disponibles en las propiedades pageX, pageY, screenX, screenY, clientX y clientY, directamente en el objeto de evento .

No digo que el evento 'clic' no funcione como lo hace todavía, por ejemplo, puede hacer clic en un botón.Sin embargo, habrá diferentes eventos para dispositivos móviles versos de sobremesa

19

Puede utilizar .on() para unir una función para múltiples eventos:

$('#element').on('click tap', function() { 
    ... 
}); 

Gracias a @ bergie3000 para señalar a this

+2

Puede tener problemas con esa solución. Consulte: http://stackoverflow.com/questions/6235794/jquery-mobile-for-every-live-tap-event-should-there-be-equivalent-click-even – bergie3000

7

Lo siento por mostrando la publicación anterior, pero para cualquier persona que esté trabajando en jQuery con Phonegap:

el evento "click" no se activará si está asignado a los elementos "div", "p", etc. tha No se debe hacer clic, ¡cuando "tocar" hace que funcione perfectamente en cualquier elemento! Eso me llevó años darme cuenta.

Conclusión, si lo hace desarrollar algo con jQuery móvil, se recomienda usar "tap" en lugar de "clic", ya que podría causar algunos problemas

+5

puede usar 'cursor: puntero' para hacer que el evento click funcione en 'div',' p', etc. –

+1

@Simon_Weaver ¡gracias! esto solucionó aleatoriamente un problema en el que tuve que crear oyentes de desenfoque con js para móvil; ahora, es simplemente 'body.mobile {puntero: cursor}' css. ¡increíble! – luchaos

Cuestiones relacionadas