navigate

Categories: Events

navigate eventversion added: 1.3

Description: A wrapper event for both hashchange and popstate

    The navigate event is a wrapper around both the hashchange and popstate events. In addition to providing a single event for all browsers it also provides a data object in both cases allowing for the unification of handlers. This feature is used by the $.mobile.navigate method to include directionality and URL information.

    Example:

    Change the hash fragment twice then log the data provided with the navigate event when the browser moves backward through history. NOTE: The state will not be provided by default in browsers that only support hashchange. For that functionality please see the navigate method docs.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    		 
    // Bind to the navigate event
    $( window ).on( "navigate", function( event, data ) {
      console.log( data.state );
    });
     
    // Trigger a navigate event by pushing state
    window.history.pushState( { foo: "bar" }, "Title", "http://example.com/#foo" );
     
    // From the `navigate` binding on the window, console output:
    // => {}
     
    // Trigger a navigate event by pushing state
    window.history.pushState( {}, "Title", "http://example.com/#bar" );
     
    // From the `navigate` binding on the window, console output:
    // => {}
     
    // Trigger a navigate event by moving backward through history
    window.history.back();
     
    // From the `navigate` binding on the window, console output:
    // => { foo: "bar" }