Prevent click event after handling jQuery Mobile tap event on iOS

ios, javascript, jquery, jquery-mobile

Solution

you can tell;

$('elementsSetThatCanBeTapped').on('tap', function(e) {
   e.preventDefault();
   e.stopPropagation();
   $(this).off('click');
})

Problem

To improve responsiveness in our web app on iPad, I switched from responding to the click event to responding to the jQuery Mobile "tap" event. It works great and is much more responsive, but it introduced a new error. When users tap the screen on an iPad, iOS sends the TOUCHSTART and TOUCHEND events which jQuery Mobile treats as a "tap". But then 300ms later, iOS sends a "click" event. If I respond to the "tap" by advancing to the next page before the "click" occurs then the next page receives the "click" and if a button on the new page happens to appear in the location of the tap then it gets clicked. My workaround for now is to give the user visual feedback in response to the "tap" but wait for the "click" before proceeding to the next page. My question is whether it's possible to handle the "tap" and somehow tell Safari or iOS not to send the "click" at all.

Original source