Jquery Mobile Methods and utilities

jQuery Mobile exposes several methods and properties on the $.mobile object for use in your applications.

$.mobile.changePage (method)

Programmatically change from one page to another. This method is used internally for transitions that occur as a result of clicking a link or submitting a form, when those features are enabled.

Arguments

to

• String, url to transition to ("about/us.html")
• jQuery object ($("#about"))
• Array specifying two page references [from,to] for transitioning from a known page. From is otherwise assumed to be the current page in view (or $.mobile.activePage ).
• Object for sending form data. ({url: url, data: serialized form data, type: "get" or "post"}

transition (string, examples: "pop", "slide"," "none")

reverse (boolean, default: false). True will cause a reverse-direction transition.

changeHash (boolean, default: true). Update the hash to the to page's URL when page change is complete.

Examples:

   
//transition to the "about us" page with a slideup transition    
$.mobile.changePage("about/us.html", "slideup"); 

//transition to the "search results" page, using data from a form with an ID of "search""   
$.mobile.changePage({
 url: "searchresults.php", 
 type: "get", 
 data: $("form#search").serialize()
});  

//transition to the "confirm" page with a "pop" transition without tracking it in history   
$.mobile.changePage("../alerts/confirm.html", "pop", false, false); 
  
   
   

jqmData(), jqmRemoveData(), and jqmHasData() (method)

When working with jQuery Mobile, jqmData and jqmRemoveData should be used in place of jQuery core's data and removeData methods (note that this includes $.fn.data, $.fn.removeData, and the $.data, $.removeData, and $.hasData utilities), as they automatically incorporate getting and setting of namespaced data attributes (even if no namespace is currently in use).

Arguments:

See jQuery's data and removeData methods

Also:

When finding elements by their jQuery Mobile data attribute, please use the custom selector :jqmData(), as it automatically incorporates namespaced data attributes into the lookup when they are in use. For example, instead of calling $("div[data-role='page']"), you should use $("div:jqmData(role='page')"), which internally maps to $("div[data-"+ $.mobile.ns +"role='page']")without forcing you to concatenate a namespace into your selectors manually.

$.mobile.pageLoading (method)

Show or hide the page loading message, which is configurable via $.mobile.loadingMessage.

Arguments:

Done (boolean, defaults to false, meaning loading has started). True will hide the loading message.

Examples:

   
//cue the page loader    
$.mobile.pageLoading(); 

//hide the page loader    
$.mobile.pageLoading( true ); 
   
   

$.mobile.path (methods, properties)

Utilities for getting, setting, and manipulating url paths. TODO: document as public API is finalized.

$.mobile.base (methods, properties)

Utilities for working with generated base element. TODO: document as public API is finalized.

$.mobile.silentScroll (method)

Scroll to a particular Y position without triggering scroll event listeners.

Arguments:

yPos (number, defaults to 0). Pass any number to scroll to that Y location.

Examples:

   
//scroll to Y 100px    
$.mobile.silentScroll(100); 
   
   

$.mobile.addResolutionBreakpoints (method)

Add width breakpoints to the min/max width classes that are added to the HTML element.

Arguments:

values (number or array). Pass any number or array of numbers to add to the resolution classes. Read more about this feature here: Orientation & resolution targeting.

Examples:

   
//add a 400px breakpoint    
$.mobile.addResolutionBreakpoints(400); 
//add 2 more breakpoints    
$.mobile.addResolutionBreakpoints([600,800]); 
   
   

$.mobile.activePage (property)

Reference to the page currently in view.