2010-11-06

Workaround for jQuery .live() event handler not working on Mobile Safari, iPad, iPod Touch, iPhone

I have a web app where I use the jQuery .live() method to attach a click event handler to a table td element (to convert it into a input field when the user clicks the table cell and then post the input using ajax.)  Everything worked properly on all the mainstream browsers (Firefox, Safari, Chrome) but nothing happened when I tapped the table cell when viewing the app on my iPad.  Some Googling led me to this blog post:

jQuery’s live click handler on mobile Safari

This guy discovered that the .live() click event will fire on Mobile Safari (i.e. iPad, iPod Touch, iPhone) when it is attached to certain elements (like an anchor tag), but for some other elements it will only fire if you add onclick="" to the element tag.

I added onclick="" to my td tag for my table cell and voila, tapping on the table cell works now to convert it to an input field like it should.