Jquery click not working with ipad

Question

we have a web application which is using Jquery blockUI to open a pop up and do some action. All of this works fine on Safari, and IE 8. problem is with Ipad. none of the ac

Answer 1

Probably rather than defining both the events click and touch you could define a an handler which will look if the device will work with click or touch.

var handleClick= 'ontouchstart' in document.documentElement ? 'touchstart': 'click';
$(document).on(handleClick,'.button',function(){
alert('Click is now working with touch and click both');
});

Answer 2

I had a span that would create a popup. If I used "click touchstart" it would trigger parts of the popup during the touchend. I fixed this by making the span "click touchend".

Answer 3

I found that when I made my binding more specific, it began to work on iOS. I had:

$(document).on('click tap', 'span.clickable', function(e){ ... });

When I changed it to:

$("div.content").on('click tap', 'span.clickable', function(e){ ... });

iOS began responding.

Answer 4

I usually use

.bind("click touchstart", function(){

});

instead of:

.click(function(){

});

That way you are binding the the correct event. It's also quicker, the touch responds much faster than click for some reason.

Answer 5

Thanks to the previous commenters I found all the following worked for me:

Either adding an onclick stub to the element

onclick="void(0);" 

or user a cursor pointer style

style="cursor:pointer;"

or as in my existing code my jquery code needed tap added

$(document).on('click tap','.ciAddLike',function(event)
{
    alert('like added!'); // stopped working in ios safari until tap added
});

I am adding a cross-reference back to the Apple Docs for those interested. See Apple Docs:Making Events Clickable

(I'm not sure exactly when my hybrid app stopped processing clicks but I seem to remember they worked iOS 7 and earlier.)