Permalink
Browse files

Navigation: Fixed syntax error in sample code

  • Loading branch information...
1 parent 5c73239 commit 5190a952da8574734ac86bae44a911b94fd54b26 @loufranco loufranco committed with gabrielschulhof Jan 31, 2014
Showing with 40 additions and 40 deletions.
  1. +40 −40 demos/navigation/index.php
View
@@ -41,37 +41,37 @@
<pre>
<code>
// Define a click binding for all anchors in the page
-$( "a" ).on( "click", function( event ){
+$( "a" ).on( "click", function( event ) {
- // Prevent the usual navigation behavior
- event.preventDefault();
+ // Prevent the usual navigation behavior
+ event.preventDefault();
- // Alter the url according to the anchor's href attribute, and
- // store the data-foo attribute information with the url
- $.mobile.navigate( this.attr( "href" ), {
- foo: this.attr("data-foo")
- });
+ // Alter the url according to the anchor's href attribute, and
+ // store the data-foo attribute information with the url
+ $.mobile.navigate( $(this).attr( "href" ), {
+ foo: $(this).attr("data-foo")
+ });
- // Hypothetical content alteration based on the url. E.g, make
- // an Ajax request for JSON data and render a template into the page.
- alterContent( this.attr("href") );
+ // Hypothetical content alteration based on the url. E.g, make
+ // an Ajax request for JSON data and render a template into the page.
+ alterContent( $(this).attr("href") );
});</code></pre>
<p>Next, a <code>navigate</code> event binding helps in responding to backward and forward navigation via the browsers history API. Here the <code>alterContent</code> function can address the direction in which the browser is navigating as well as any additional information stored on the data object when <code>$.mobile.navigate</code> was invoked to store the corresponding history entry.</p>
<pre><code>
// Respond to back/forward navigation
$( window ).on( "navigate", function( event, data ){
- if( data.state.foo ){
- // Make use of the arbitrary data stored
- }
+ if ( data.state.foo ) {
+ // Make use of the arbitrary data stored
+ }
- if( data.state.direction == "back" ) {
- // Make use of the directional information
- }
+ if ( data.state.direction == "back" ) {
+ // Make use of the directional information
+ }
- // reset the content based on the url
- alterContent( data.state.url );
+ // reset the content based on the url
+ alterContent( data.state.url );
});</code></pre>
<h2>Event Example </h2>
@@ -83,13 +83,13 @@
<pre><code>
// Bind to the navigate event
$( window ).on( "navigate", function() {
- console.log( "navigated!" );
+ console.log( "navigated!" );
});
// Bind to the click of the example link
$( "#event-example" ).click(function( event ) {
- event.preventDefault();
- location.hash = "foo";
+ event.preventDefault();
+ location.hash = "foo";
});
</code></pre>
@@ -105,24 +105,24 @@
<code>
// Bind to the click of the example link
$( "#method-example" ).click(function( event ) {
- // Append #bar
- $.mobile.navigate( "#bar", {
- info: "info about the #bar hash"
- });
-
- // Replace #bar with #baz
- $.mobile.navigate( "#baz" );
-
- // Log the results of the navigate event
- $( window ).on( "navigate", function( event, data ){
- console.log( data.state.info );
- console.log( data.state.direction );
- console.log( data.state.url );
- console.log( data.state.hash );
- });
-
- // Go back to pop the state for #bar and log it
- window.history.back();
+ // Append #bar
+ $.mobile.navigate( "#bar", {
+ info: "info about the #bar hash"
+ });
+
+ // Replace #bar with #baz
+ $.mobile.navigate( "#baz" );
+
+ // Log the results of the navigate event
+ $( window ).on( "navigate", function( event, data ) {
+ console.log( data.state.info );
+ console.log( data.state.direction );
+ console.log( data.state.url );
+ console.log( data.state.hash );
+ });
+
+ // Go back to pop the state for #bar and log it
+ window.history.back();
});
</code>
</pre>

0 comments on commit 5190a95

Please sign in to comment.