Add in a tag
Data-ajax= "false"
Or
Rel= "external"
Property
Example: <a data-ajax= "false" href= "Http://www.***.com/help/***.zip" > click Download </a>
Detailed
External page Links
JQuery Mobile has actively initiated the process of creating AJAX sites and testimonies.
By default, when you click on a link, it points to an external page (such as. products.html), but the framework parses the link's href attribute and then emits an AJAX entreaty (Hijax) and displays the prompt being loaded.
If the Ajax solicitation succeeds, the new page content is added to the DOM side, all mobile widgets are actively initialized, and the new page is animated to show the transitions.
If the Ajax plea fails, the framework displays a small error message ("E" "palette style) that dissipates within a short period of time and does not break the current navigation flow (i.e., the page will not refresh and will not affect the Progressive Retreat hedgehog button)
Internal page Links
A single HTML document can contain multiple "page", only one page contains multiple data-role="page"
div, each pagediv must be a unique ID ( id="foo"
), and link to the Response Page app anchor can ( href="#foo"
). When you click on a link, The framework looks for the internal "page" with the ID anchor href and displays it in the current interface.
Be aware that if you are linking from one mobile page to a page that contains multiple internal pages through the process of Ajax, you need to add one or more for that link rel="external"
data-ajax="false"
. This property tells the framework to load the page from the beginning, and the URL hash will clear 0. This is critical because Ajax The page applies hash (#) to track the Ajax history, and conflicts occur when a page with multiple internal pages applies a hash to guide the internal page.
For example, a link to a page that contains multiple internal pages would look like this:
<a href="multipage.html" rel="external">Multi-page link</a>
Here is an example of a 2 "pages" page, built by two jquery Mobile Div, each of which is navigated by its ID, and the ID on those pages only needs to support internal page links, and if each page is a separate HTML document, these IDs are optional. The following is a two page, body
inside the element.
<body> <!-- Start of first page --> <div data-role= "page" id= "foo" > <div data-role= "header" >
View Multi-page templates
Please pay attention: because we have applied a hash to track the history of all Ajax "page", today, in a jquery Mobile page, it is not possible to use the link as a popular anchor ( index.html#foo
), because the framework will look for a ID
#foo
"" Page "" To jump instead of migrating content that contains that id like a popular HTML page.
Retreat Hedgehog Link
If you apply a property to an a tag data-rel="back"
, than the click on the top to mimic the retreat hedgehog button while ignoring its href attribute. This is useful for linking back to a named page, such as when there is a "home" Link or when using JavaScript to generate a retreat hedgehog button, or a button to close a dialog box. When you apply this feature to your source code, you must supply a meaningful href to actually indicate the URL of the reference page. (This makes the feature also available in the C-level browser). Again, remember that if you just apply a retreat to the hedgehog to shrink the transition without really retreating in the history record, you can apply data-direction="reverse"
to swap.
Redirect and link to a catalog
When linking to a catalog address (such as replacing href= "typesofcats/index.html" with href= "typesofcats/"), you must supply a back slash. This is because jquery mobile assumes that the last "/" in the URL The following project group is a file name, and JQuery Mobile removes the project group to create a base address when a page is referenced in the future.
However, you can resolve the problem by returning the page div that has the attribute specified by the procedure data-url
. JQuery Mobile Applies the value of this property to update the URL to replace the page that enhancedments implored. This also allows you to return URL changes as a result of redirection, for example, You can submit a form to "/login.html", but return a URL "/account" after a successful commit. This object allows you to grasp the history stack of jquery Mobile in some degree, here are some examples:
This link points to "docs-links-urltest/index.html", which is an index page in a catalog: The page returned by Test link will be "docs/pages/docs-links-urltest/" (including a back slash) to update the hash, which is done by the value of the Data-url on that page of the process. Remember that this value will change all the hash, whether the swap depends on you, when the refresh or deep link URL issued by the request can parse the correct page.
http://blog.csdn.net/xpsharp/article/details/7267596