Question

I am trying to create a jQuery mobile link or button which will navigate to another page entirely and not try to assimilate it into its own DOM.

Example:

 <a href="http://www.google.com" data-role="button" data-icon="search" data-inline="true" >Search</a>

In my jQuery mobile page, it performs a transition to the page and applies its renderings. I want the Google page to show up, as it normally would, not assimilate into the DOM space belonging to the jQuery mobile page.

I want to keep the look and feel of the link/button, yet I want its action to navigate away from the page completely to an entirely new DOM space. How can I do this?

Thank you.

Answer 1

Add rel=”external” to your a tag. This is will notify the DOM that you are leaving the page and not use AJAX navigation.

Like this:

<a href="http://www.google.com" data-role="button" data-icon="search" data-inline="true" rel="external">Search</a>