How to make my 'click' function work with iOS

Click ": means When a mousedown and mouseup event occur on the same element OR an element is activated by the keyboard.

from Jquery Bug, there is work around , Just add "cursor: pointer" to the element's CSS and the click event will work as expected. and you can even see this Jquery click on Ios for help

Actually, the accepted answer did not work for me.I tried using "cursor:pointer", onclick="", and even convert the element to an anchor tag.

What i did to make it work is to bind the touchstart event insted of the click event. To make it work on all platforms i had to to an ugly ua spoofing like this:

var ua = navigator.userAgent,event = (ua.match(/iPad/i) || ua.match(/iPhone/)) ? "touchstart" : "click";jQuery("body").on(event, '.clickable_element', function(e) {    // do something here});

Based on Marek's answer this is my take on it (it's a bit cleaned up):

var ua = navigator.userAgent, pickclick = (ua.match(/iPad/i) || ua.match(/iPhone/)) ? "touchstart" : "click";$('.clickable_element').on(pickclick, function(e) {     // do something here});

There's still a lot of work ahead for the industry when it comes to standards…

EDIT:

Didn't work out on Android phones. Took a more rigid approach:

if (document.documentElement.clientWidth > 1025) { pickclick = 'click' }if (document.documentElement.clientWidth < 1025) { pickclick = 'touchstart' }$('.clickable_element').on(pickclick, function(e) {     // do something here});