jTap — событие клика для сенсорных устройств

[@artishok]

Event: undefined

[@BR0kEN]

Это была моя ошибка в js для демонстрации, не в плагине. Исправил еще вчера.

[@Rastishka]

Ссылка на демонстрацию, так удобнее:


А можете в демонстрации сделать пример как стандартный click() работает без вашего плагина? Для сравнения. А то пока неочевидны преимущества.

[@Fesor]

По идее отработка touchstart/touchend нивелирует задержку срабатывания ивента click в 300 миллисекунд, что думаю, вполне себе преимущество.

[@Rastishka]

Не, я не о том. Я верю что этот плагин очень полезен и имеет преимущества.

Я открыл ссылку автора на девайсе — вижу что кликается. Но мне не с чем сравнить, есть задержка или нет, и насколько эта задержка раздражает. Если ниже был бы другой прямоугольник со стандартным кликом (с задержкой) — преимущества были бы более наглядны.

[@demimurych]

Вероятно, и я с этим полностью согласен, что задержка при клике в 300мс штука настолько для всех привычная (очевидная), что в примерах не нуждается.

[@BR0kEN]

Сделал. Так и правда нагляднее.

Также хочу описать некоторые особенности: зажатие ЛКМ, зажатие ЛКМ и перетаскивание, нажатие колесиком и множественные нажатия — событие «click» выполняется, «tap» — нет.

[@Rastishka]

Хм, да, так гораздо нагляднее.
Самое забавное, что я всегда думал что эта пауза — это у меня safari в телефоне тормозит. =(

[@ssleptsov]

в хроме можно установить расширение, чтобы текующую ссылку в qr код сгенерить link
P.S. удобно когда надо кучу плагинов попробыват на любом мобильном устройстве

[@xGromMx]

Hammerjs не подошёл?)

[@k12th]

Хаммер весит значительно больше и как-то странновато интегрируется с jQuery.

[@Fesor]

Hammerjs помимо тапа поддерживает гестуры, так что не удивительно что он весит больше. Да, просто что бы повысить отзывчивость кнопок в вашем сервисе оно не нужно, но если вы захотите добавить свайпы и прочие модные штуки, то выбор очевиден.

[@k12th]

Бесспорно.

[@dom1n1k]

Что-то не работает.
Пробовал на двух устройствах (телефон Android 4.0.3 и планшет Android 4.1.1) и в четырех браузерах (системный, Opera Classic, Firefox, UC).
Событие click везде работает нормально.
Правый квадрат вашей демки как-то очень неохотно, через раз, срабатывает только на 2-х комбинациях из 8-ми: телефон/системный и планшет/опера.
Во всех прочих комбинациях многократные и настойчивые тапы не привели ни какому результату.

[@BR0kEN]

Андроида, к сожалению, под рукой нет. Завтра на работе все проверю.

Тестировал на iPhone, iPod, iPad и в Chrome DT.

[@Aux]

Подтверждаю! Второй тап не обрабатывается. Видать браузер шлёт двойной тап или хз что.

[@BR0kEN]

Проверил на Android 2.3 и 4.0.3 в стандартных браузерах и, на первом, в Opera Mini — все работает.

Скрин с Android 2.3

Скрин с Android 4.0.3

[@Aux]

Вы попробуйте быстро тыкать несколько раз. Первый раз и у меня тыкается оок.

[@Fesor]

браузер ничего о тапах не знает. тап это быстрая смена событий touchstart/touchend. Точно так же как и для click mousedown/mouseup

[@wwwsevolod]

было бы круто если бы вы оформили это как bower пакет и приделали туда объявление в стиле amd (опциональное, которое типа проверяет наличие нужных функций и если есть все что надо объявляет через define, пример можно например в коде lodash посмотреть).

[@ixside]

Какая в итоге задержка стала с этим плагином?

[@BR0kEN]

Минимальной (~20-50ms). Попробуйте демо.

[@LostSenSS]

Идея взята отсюда? github.com/ftlabs/fastclick
Или просто совпадение?

[@BR0kEN]

Идея, если так можно выразится, вынужденная. В посте об этом написано.

[@Fesor]

Простите, а есть еще идеи как обрабатывать тач-события? Имплементаций разнящихся уже мильен.

[@dm9]

Интересно, как Ваш tap взаимодействует с hover. Например, если пункт меню подсвечивается при наведении и одновременно имеет событие click. Это типичная проблема на ios-устройстве: сначала срабатывает «ховер», а при втором клике уже «клик». Проверить сейчас сам не могу, но написать об этом стоило бы.

[@BR0kEN]

Добавил в демо три состояния: hover, focus, active. Срабатывает сразу.

[@mu3]

А что со swipe? Был бы рад увидеть и их в этом или дополнительном таком же минималистичном плагине.

[@Fesor]

eightmedia.github.io/hammer.js/ — как по мне довольно минималистичная штука.

[@mu3]

И вопрос наполовину по теме (это со всеми плагинами так): если привязать tap event к объекту, расположенному на верхнем диве, тап по которому скрывает этот див, то через те самые 300мс происходит дополнительный click event по тому, что находится под этим дивом (в моём случае активируется input), есть способ это побороть?
Перепробовал уже в различных местах preventDefault, stopPropagation, return false, отмену десктопных событий; помогает только setTimeout(360)…