A web móvel pode ser um lugar estranho às vezes. Um dos detalhes mais importantes a se ter em mente ao criar uma ótima experiência do usuário é como tocar e clicar funcionam e como eles interagem (dica: mal).
Clique de Apoio
Os navegadores móveis que oferecem suporte a associações de evento de toque (por exemplo, Webkit) também devem oferecer suporte a associações de clique no mesmo elemento, caso contrário, as páginas da web criadas para a área de trabalho seriam completamente inúteis em navegadores móveis. Portanto, para cada toque em uma página da web para celular, um clique é disparado junto com ela.
Opções
Inicialmente, isso parece um detalhe trivial e que podemos apenas ligar para clicar e terminar com toda a discussão. Infelizmente, existe um atraso de 300 ms (+/-) entre o touchstart e os eventos de clique para permitir a rolagem, o cancelamento e outras interações. Isso significa que, se você apenas ligar para clicar, suas interações com o usuário ficarão muito lentas.
Supondo que você se preocupe com esse tipo de coisa, a próxima melhor solução seria normalizar pegando o primeiro evento e cancelando o segundo, mas antes de correr para fazer isso, você deve saber que o evento click nem sempre dispara no mesmo objeto como o evento de toque. Os navegadores móveis usam heurísticas complexas para determinar os alvos de toque e clique. Em alguns navegadores, se você clicar próximo à borda de um elemento, o clique disparará em um alvo diferente.
O jQuery Mobile resolveu esses problemas (na medida em que podem ser resolvidos) com o plug-in vmouse. Ele fornece eventos de mouse virtual que manipularão navegadores móveis e de desktop para que seus retornos de chamada sejam executados o mais rápido possível. Você pode colocar as mãos nele clonando o repo e removendo o invólucro amd define.
https://github.com/jquery/jquery-mobile/blob/master/js/jquery.mobile.vmouse.js
update Atualizamos o depto para permitir o download do vmouse sozinho a partir do construtor: http://jquerymobile.com/download-builder/ simplesmente selecione “Latest” ou o próximo alpha e você poderá escolher o vmouse por em si.
Mudança de conteúdo
A última coisa a ter em mente, que não pode ser realmente resolvida em JavaScript, é uma mudança de conteúdo acionada por evento de toque. Ou seja, se você deslocar o conteúdo sob o local do evento de toque antes que o evento de clique seja disparado, o evento de clique será disparado em tudo o que estiver abaixo dele. Se você não conseguir mais nada com isso, lembre-se, não mude o conteúdo em um evento de toque.
Padrões
Finalmente, uma nota sobre padrões. Especificamente, o padrão de evento de toque do w3c está travado graças a problemas de patentes, o que significa que as coisas vão piorar com a introdução de seu próprio padrão pela Microsoft (MSPointer). Todos nós devemos nos acostumar a lidar com a disparidade entre as duas estruturas de eventos, porque isso vai ser assim por um tempo.
Lendo
Muito mais leituras do meu amigo Kin Blas:
http://blogs.adobe.com/adobeandjquery/2011/03/07/the-current-state-of-touch-events/