From 4f12d469454f777c845ee245d60d5a7c3a710db9 Mon Sep 17 00:00:00 2001 From: scottjehl Date: Wed, 11 Jan 2012 10:50:22 +0700 Subject: [PATCH] By caching the href value to data and switching the href to a #, we can avoid address bar showing in iOS on every click. The click handler resets the href during its initial steps if this data is present. Note that the address bar will still likely drop down when you click the browser's back button. The only time the back button will not drop the address bar appears to be when the back button does not trigger a pushstate operation - so pushstate would either have to be disabled, or the page would have to be local (multipage), or the page would need to be a dialog (since then going back would only be a hashchange). Still, progress. --- js/jquery.mobile.navigation.js | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/js/jquery.mobile.navigation.js b/js/jquery.mobile.navigation.js index d5deb1a3..76f30c8a 100755 --- a/js/jquery.mobile.navigation.js +++ b/js/jquery.mobile.navigation.js @@ -1231,6 +1231,11 @@ define( [ $activeClickedLink = $( link ).closest( ".ui-btn" ).not( ".ui-disabled" ); $activeClickedLink.addClass( $.mobile.activeBtnClass ); $( "." + $.mobile.activePageClass + " .ui-btn" ).not( link ).blur(); + + // By caching the href value to data and switching the href to a #, we can avoid address bar showing in iOS. The click handler resets the href during its initial steps if this data is present + $( link ) + .jqmData( "href", $( link ).attr( "href" ) ) + .attr( "href", "#" ); } } }); @@ -1254,6 +1259,11 @@ define( [ httpCleanup = function(){ window.setTimeout( function() { removeActiveLinkClass( true ); }, 200 ); }; + + // If there's data cached for the real href value, set the link's href back to it again. This pairs with an address bar workaround from the vclick handler + if( $link.jqmData( "href" ) ){ + $link.attr( "href", $link.jqmData( "href" ) ); + } //if there's a data-rel=back attr, go back in history if( $link.is( ":jqmData(rel='back')" ) ) { @@ -1329,7 +1339,7 @@ define( [ //this may need to be more specific as we use data-rel more role = $link.attr( "data-" + $.mobile.ns + "rel" ) || undefined; - + $.mobile.changePage( href, { transition: transition, reverse: reverse, role: role } ); event.preventDefault(); });