Fix jQuery Click Event on Touch Devices (IOS)

Coding

Filed Under: Code Snippets


If jQuery click event is not working on touch devices especially iPhone or iPad, the fix is quite simple.

Advertisement

Lets say we have an anchor tag and you want to perform some activity on click with jQuery.

<a href="" id="click-button">Click Here</a>

We normally write jQuery click event this way

$(#click-button).click( function() { 

// Code Here

});

OR for touch devices

$(#click-button).on('click touchstart' function() { 

// Code Here

});

But sometimes, both above jQuery snippets won’t work on IOS or all touch devices. To fix this, first you can try adding css property cursor: pointer; to an anchor tag or any tag with whom you want click event. If it still doesn’t work, the below code snippet will make it clickable on touch devices.

Advertisement
$(body).on('click touchstart', '#click-button', function() { 

// Code Here

});

I hope it will solve the click event on touch devices.

Let me know if the above code still works in the comments section below.

Also Read:


Tags: ,



Leave a Reply

Your email address will not be published. Required fields are marked *