Почему событие touchstart после нажатия?

Question

Вот что-то странное, что я уверен, что работал в более ранних мобильных браузерах: в Chrome на Android и Safari на iOS кажется, что событие touchstart увольняется после события click, а не раньше. Когда это изменилось?

Простой пример:

jQuery(function($) { 
    var touched = false; 
    $('#clicky').on('touchstart', function(evt){ 
     touched = true; 
     evt.preventDefault(); 
    }) 
    .click(function(){ 
     if (!touched) { 
      alert("somehow touch didn't fire") 
     } 
    }); 
}) 

Выполнить эту скрипку, и вы увидите, что предупреждение может выскочить на Android и IOS, когда он должен на самом деле никогда не показывать!

http://jsfiddle.net/quxnxu7d/2/

Answer 1

Вы пробовали использовать mousedown вместо click? Таким образом, вы должны получать разные события для прикосновения и щелчка без двойного стрельбы. Вам также, вероятно, потребуется использовать keydown, чтобы этот сайт был доступен.

Answer 2

Я запускал его через Chrome на Android, и он работал так, как вы ожидали от меня. Я добавил предупреждение к обработчику touchstart, и он выстрелил, чтобы быть уверенным, что он стрелял первым, и это произошло.

Посмотрите на touch events mdn article. В статье конкретно упоминается:

вызова preventDefault() на touchstart или первом touchmove случае серии предотвращает соответствующие события мыши от стрельбы

Click is a mouse event так «должны» работать, как вы ожидаете (и он работал для меня). Я проверил бы, что события действительно заканчиваются не в порядке (используйте console.log() вместо alert()) в ваших целевых браузерах. Если они есть, что вполне возможно с менее совершенными браузерами/спецификациями, попробуйте использовать другое событие мыши, например mouseup. Я предполагаю, что вы сможете найти событие, которое будет работать последовательно.

Удачи вам!

Answer 3

Существует 300мс задержки между физическим краном и обжигом при клике на некоторых мобильных браузерах (например, IOS Safari) я столкнулся с той же проблемой и FastClick JQuery плагин фиксированным это для меня

Имеют посмотреть FastClick