JQuery. Mobile. changePage in jQuery mobile

Source: Internet
Author: User

JQuery. Mobile. changePage in jQuery mobile
The jQuery. mobile. changePage method is still widely used. As a veteran, it is necessary to summarize the implementation methods of jQuery mobile. For a series of articles, see the jQuery Mobile column. Jquery. mobile. changepage is an outdated jQuery Mobile 1.4.0 and will be deleted in 1.5.0. Use the change () method of the pagecontainer component.
Note that this method is used internally to load and convert pages as a result. When you click a link or submit a form. Navigation to external pages has no effect. It must be an internal DIV page.
JQuery. mobile. changePage (to [, options])Parameter description:
To: String or Object type. The target page to jump.
Options: Optional parameter. It is of the Object type. The attributes in the object are described as follows:
AllowSamePageTransition: Boolean type. The default value is false. By default, changepage () ignores the request to change the current active page. Set to true to allow request execution. Note that some pages are converted to another page (the pages and pages of the changepage request are different) and they may not be animated as expected.
ChangeHash: Boolean type. The default value is true. If it is set to true, the Hash update in the address bar will create a new browser history. If it is set to false, the input page replaces the current page in the browser history. The user navigation cannot return to the previous page through the "back" button of the browser.
Data: Object or string type. The default value is undefined. Parameters of the ajax request sent to the webpage.
DataUrl: String type. The default value is undefined. Update the URL of the browser address when page conversion is completed. If this parameter is not specified, the data-url attribute value of the page element is used.
PageContainer:( JQuery selector, default: $. mobile. pageContainer) specifies the container that should contain the page.
ReloadPage: Boolean type. The default value is false. Force refresh the page, even if the dom element in the page container is ready, force refresh. Only when the to parameter of changePage () is an available address.
Reverse: Boolean type. The default value is false. Set the orientation of the page transition animation. If it is set to true, it will lead to reverse transition.
Role: String type. The default value is undefined. Use the data-role value when displaying the page. By default, this parameter is undefined, depending on the @ data-role attribute of the element.
ShowLoadMsg: Boolean type. The default value is true. Set whether to display the loading information when loading the external page.
Transition: String type. The default value is $. mobile. defaultPageTransition. Transition to other pages.
Type: String type. The default value is get. Only the to parameter is specified for regular use.
Example: Add changehash: false to avoid iframe problems.

$. Mobile. changePage (".. /resources/us.html ", {transition:" slideup ", changeHash: false}); $. mobile. changePage (".. /resources/results. php ", {type:" post ", data: $ (" form # search "). serialize (), changeHash: false}); $. mobile. changePage (".. /resources/confirm.html ", {transition:" pop ", reverse: false, changeHash: false}); // jump to the" about us "page with the slideup effect $. mobile. changePage ("about/us.html", "slideup ");/ /Jump to the "confirm" page with the pop effect and do not record its history in the url hash $. mobile. changePage (".. /alerts/confirm.html "," pop ", false, false); // jump to the" search results "Page and submit form data with the id of" search "$. mobile. changePage ({url: "searchresults. php ", type:" get ", data: $ (" form # search "). serialize ()}); // defines the page url, type, and data as variables for transmission. $. Mobile. changePage ({url: formresults. php, type: 'get', data: $ ('form # myform '). serialize ()}); // use changepage to load the third page $. mobile. changePage ([$. mobile. activePage. data ('ui. prevPage '), anotherPreviousPage], 'pop ');

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.