Широкое применение мобильных устройств для доступа в интернет накладывает свои специфические требования на разработку веб-сайтов. Привычный обработчик onclick может срабатывать совместно с ontouchstart, а может не срабатывать вовсе на мобильном устройстве.
Но вам скорее всего нужно фиксировать лишь факт нажатия пользователя на элемент, причем однократно.
Наверное, стоит начать с того как отличить какое событие произошло на самом деле, это можно подсмотреть в атрибутах объекта event:
|
1 2 3 4 5 6 |
$('...').on('click touchstart', function(event) { if (event.type == "touchstart") { alert('Был касание'); } else { alert('Был клик'); } }); |
Если происходят оба события, а код выполнить необходимо лишь один раз, то нужно как то сообщить следующему обработчику, что работа уже выполнена.
Функция event.stopPropogation(), остановит передачу обработки в родительский контейнер и нам не подходит.
Функция event.stopImmediatePropagation(), прекратит обработку текущего типа события, если обработчиков несколько, но события другого типа сработают.
Можно использовать какую то глобальную переменную или добавить признак в объект event, чтобы прочитать его в следующем обработчике. Это рабочие варианты, но есть более элегантное решение:
|
1 2 3 4 5 6 |
$('...').on('click touchstart', function(event) { // ваш код ... // вернем false, чтобы остановить всю очередь обработки событий контейнера return false; }); |
В большинстве случаев это наиболее простой вариант.
