• jQuery Mobile document ready vs pageinit events

    by  • September 11, 2014 • Blog

    Working with jQuery Mobile events in a web mobile projects. I am wondering what is the best events we should capture to init our data for the apps. The problem is we have 3 type of events



    And …

    So they are work well with me in my project but I am wondering what the deference from them.

    First all events can be found here: http://api.jquerymobile.com/category/events/

    Lets say we have a page A and a page B, this is a unload/load order:

    • page B – event pagebeforecreate
    • page B – event pagecreate
    • page B – event pageinit
    • page A – event pagebeforehide
    • page A – event pageremove
    • page A – event pagehide
    • page B – event pagebeforeshow
    • page B – event pageshow
    For better page events understanding read this:
    • pagebeforeload, pageload and pageloadfailed are fired when an external page is loaded
    • pagebeforechange, pagechange and pagechangefailed are page change events. These events are fired when a user is navigating between pages in the applications.
    • pagebeforeshow, pagebeforehide, pageshow and pagehide are page transition events. These events are fired before, during and after a transition and are named.
    • pagebeforecreate, pagecreate and pageinit are for page initialization.
    • pageremove can be fired and then handled when a page is removed from the DOM

    If for some reason page transition needs to be prevented on some condition it can be done with this code:

    And when page event use for handling particular page event, you can use the event something like this