jquery Mobile Web Development page jump and load external page implementation _jquery

Changepage () page jump

JQuery.mobile.changePage (to [, Options])

Jump from one page to another and use the $.mobile object's Changepage method to implement it. However, to use this method, you need to click on a link or submit a form to achieve. This method has two parameters.

To: is the first parameter that is necessary and indispensable. Type: String or object.

String: Absolute or relative URL address. such as: ("about/us.html")

Object:
jquery Selector object, such as: ($ ("#about").
An array [from,to] that specifies two page references to jump through the known pages. From is the currently visible page (or $.mobile.activepage).
The object that sends the form data, such as ({to:url, data:serialized form data, type: "Get" or "post"}.

Options: Is the second parameter, which is optional. Type: Object

Allowsamepagetransition (Boolean, default: false)
By default, Changepage () ignores requests to jump to an active page. If you set this to true, it will be executed. Developers should be aware that some of the page transitions will assume that a jump page request from the page and the target page is different, so there will be no transitions animation.

Changehash (Boolean, Default: TRUE)
Determines whether the hash value of the address bar should be updated.

Data (String or object, default: undefined)
The data to be sent through the AJAX request is available only if the to parameter of the Changepage () is an address.

Dataurl (string, default: undefined)
The URL address to update the browser address when the page transformation is complete. If not specifically specified, the Data-url property value of the page is used.

Pagecontainer (jquery selector, default: $.mobile.pagecontainer) specifies the container that should contain the page.

Reloadpage (Boolean, default: false)
Forces a refresh of the page, even when the DOM element in the page container is ready. Available only when the to parameter of the Changepage () is an address.

Reverse (Boolean, default: false)
Sets the orientation of the page transitions animation, and when set to True will cause a transition to the opposite direction.

Role (string, default: undefined)
Use the Data-role value when displaying the page. This parameter is recognized by default: Undefined, depending on the @data-role attribute of the element.

Showloadmsg (Boolean, Default: TRUE) sets whether to display loading information when loading an external page.

Transition (String, default: $.mobile.defaultpagetransition) When using the displayed page, the transition.

Type (string, default: Get)
The method to use when specifying a page request ("Get" or "post"). Available only when the to parameter of the Changepage () is an address.

To slideup effect jump to "about Us" page

$.mobile.changepage ("about/us.html", "Slideup"); 
The pop effect jumps to the "confirm" page and does not record its history $.mobile.changepage in the URL hash

(". /alerts/confirm.html "," Pop ", false, false); 
Jump to the search results page and submit the form data

$.mobile.changepage ({url: "searchresults.php", type: "Get" with id "search", Data: $ (" Form#search "). Serialize ()}); 
The page URL, type, and data are defined as variables to pass.

var pagedata = {url:formresults.php, type: ' Get ', data:$ (' Form#myform '). Serialize ()};

$.mobile.changepage (pagedata);
Use Changepage to load a third page

var previouspage = $.mobile.activepage.data (' ui.prevpage ');

$.mobile.changepage ([PreviousPage, Anotherpreviouspage], ' pop ');

loadpage () load external page

JQuery.mobile.loadPage (URL [, Options])

Loads an external page, attaches its contents, and inserts it into the DOM

URL: is the first parameter. is a must. Type: String or object.

Options: the second argument. is optional. Type: Object.

Allowsamepagetransition (Default:false)
Type: Boolean value
By default, Changepage () ignores requests to change the current page. This option is set to true to allow request execution. Developers should note that some of the page transitions assume a changepage request setting frompage, ToPage are different, so they may not be as expected as animations. The developer is responsible for providing the appropriate transitions, or shutting down this particular case.

Changehash (Default:true)
Type: Boolean value
If the hash value in the address bar should be updated

Data (default:undefined)
Type: Data or string
To send the data with an AJAX page request

Loadmsgdelay (DEFAULT:50)
Type: Digital
Load information before forced delay (ms) display. This is to get a page that has been accessed from the cache without loading information from the time

Pagecontainer (default: $.mobile.pagecontainer)
Type: jquery Selector
Specify the page elements to include

Reloadpage (Default:false)
Type: Boolean value
Forces a refresh of the page, even when the DOM element in the page container is ready. Available only when the to parameter of the Changepage () is an address.

Role (default:undefined)
Type: string
Use the Data-role value when displaying the page. This parameter is recognized by default: Undefined, depending on the @data-role attribute of the element.

Showloadmsg (Default:true)
Type: Boolean value
When loading an external page, set whether to display loading information.

Transition (default: $.mobile.defaultpagetransition)
Type: string
When using the displayed page, the transition

Type (default: "Get")
Type: string
The method to use when specifying a page request ("Get" or "post"). Available only when the to parameter of the Changepage () is an address.

Loads an external page, enhances its contents, and inserts it into the DOM. When this method is called the internal changepage () function, its first argument is a URL. This function does not affect the current page can load the page in the background. The function returns an object that gets the deferred commitment on the page that is enhanced and inserted into the document for resolution.
Load "about/us.html" pages to Dom

<!doctype html>
 
 

Load a "searchresults.php" page where the form data to send is the "search" character.

<!doctype html>