JQuery Click event not working on ipad, iphone and ipod – Fixed

I had been involved heavily building responsive web design and websites. And to be honest some of the days at work had been challenging too. But at the end of the day being a wordpress developer it brings lot of joy when task is completed.

Most recently I came across a problem I have never faced before. I made a site live, did test over all the devices and pushed it live. But later on came to know for some reasons in one of the page the click event wasn’t working on apple devices.

It took me some time to figure out and debug why click event wasn’t working on IOS devices, then with fair bit of research I was able to find the solution. Job Done.

The fix involved detecting the user agent for ios devices using navigator.userAgent andbinding the click event to these devices.

Hereby is the block of code that will do the trick.

	var user_agent = navigator.userAgent.toLowerCase(); // detect the user agent
	var ios_devices = user_agent.match(/(iphone|ipod|ipad)/)  ? "touchstart" : "click"; //check ios devices

	$(element_id_or_class).bind(ios_devices , function() { // bind the ios devices 
		console.log("IOS Devices Click Event Test ...");
	});