I recently developed a web app with jquery, which now needs to be consumed on mobile devices (ipad specifically). I now added jquery mobile to the mix, and replace click with tap, which solved several issues. I further went on and changed ready to pageinit - but this is where I hit a snag.
The old jquery code was:
$(document).ready(function() { ... });
This worked fine on desktop, but had some issues on mobile. I changed that to
$(document).pageinit(function() { ... });
This worked fine on one of my dev machines (OS X) as well as on mobile. However on my other dev machine (Ubuntu) I got error message function pageinit does not exist. I then changed it to the "correct" way:
$(document).on('pageinit', function() { ... });
This doesn't work, as the function is never getting called. I suspect this is because onpageinit event does not exist or something like that. I further tried withe pageshow, pagecreate, etc. - the same result. Also the same result in Firefox and Chrome.
So, what am I missing here? I now put in something like this in my code:
$doc = $(document);
func = $doc.pageinit ? $doc.pageinit : $doc.ready;
func(function() { ... });
which made it work on OS X, Ubuntu and iPad, but this feels/looks ugly. Any other suggestions?