I am having a problem with an application I am writing in jquery mobile and phonegap. While testing in the browser, I had no problems using the back button (no phonegap js involved). However once I try on a device with the phonegap js it breaks.
Steps to reproduce:
- Load app
- Visit several pages (linked internally using #)
- Click the back button or call history.back() from anywhere (using the js console, or by triggering something that calls it)
On the browser (chromium, firefox etc), it goes back one ‘page’ (to the previous # link whatever it was). This is the preferred behaviour.
On the device (iPhone 4, iPhone simulator, Android 2.2 (device), Android 3.2 (device)), it goes to the first/landing page (the first ‘page’ in the index.html file).
I suspect that the problem is with phonegap. Is there a way to revert to the preferred behaviour or the browser?
The problem was caused by a space in the data url I was using. It seems that the desktop browsers can handle a space properly, however the mobile browsers convert the space into a
%20%character. jQuery mobile attempts to use a space, but the browser only remembers the altered character.EDIT:
The jqm page has a data-url attribute that allows you to store multiple pages inside one html document.
The first pages can be loaded in a few ways…
In a document
or through javascript
The problem I had was with the page with the data-url
page two. On the desktop browsers the space was maintained, and the customized history control built into jqm continued to function as expected. but on the mobile browsers, the space turned into an escaped space, which the jqm history control did not recognize or track.