原生iOS网页应用+ jquery移动版。保存当前的应用程序状态

时间:2013-07-30 17:21:15

标签: jquery ios html5 jquery-mobile

我正在使用jquery移动单页模板。导航如下:

index.html -> page1.html?param1=x -> page2.html?param1=x&param2=y

在page2.html上有一个指向在Mobile Safari中打开的PDF文件的链接。在我返回正在运行的Web应用程序后,它将重新加载并从index.html.开始。这只是从主屏幕运行Web应用程序时出现的问题。

我希望这样当我返回Web应用程序时,我仍然在

page2.html?param1=x&param2=y

我也喜欢这样,当我点击该页面上的后退按钮返回

page1.html?param1=x.

我相信我必须使用localStorage来保存应用程序的状态,但我不确定需要保存哪些信息才能维护我的页面历史记录。

1 个答案:

答案 0 :(得分:1)

您可以使用localStorage来保存状态,但我认为这不会停止您描述的自动重载行为。在Apple的网站上有一个Tic-Tac-Toe游戏的例子:

https://developer.apple.com/library/safari/documentation/iPhone/Conceptual/SafariJSDatabaseGuide/Introduction/Introduction.html#//apple_ref/doc/uid/TP40007256-CH1-SW1

我不完全熟悉jQuery Mobile以及单页模板的工作原理,但是如果你可以通过localStorage保存当前的网址(例如page2.html?param1 = x& param2 = y)那么你需要在寻找这个存储值的页面上添加一些代码,如果存在则重定向。

粗略的例子:在加载jQuery之后,您可能会在代码中添加类似的内容:

$('a').on('click', function(){          
    localStorage.currentURL = this.href
});

现在,每次点击链接时,该值都会保存到localStorage

然后在相关页面的顶部,您可以输入以下内容:

if (localStorage.currentURL && location.currentURL != location.href) {
    location.href = localStorage.currentURL;
}

此部分查找保存到localStorage的值,如果找到,则将页面重定向到正确的URL。它还确保保存的值不是您已经使用的页面,否则我们将无限循环。

从技术上讲,重新加载行为仍然存在,但您的应用可以根据您上次的位置重定向自己。这就是为什么您可能希望在打开<body>标记之后和任何其他脚本加载之前直接放置它 - 以便它快速加载和重定向。

如果您想要一个真正破坏重新加载行为的解决方案,我认为您必须使用Apple在此处提供文档的HTML5离线应用程序缓存进行探索:

https://developer.apple.com/library/safari/documentation/iphone/conceptual/safarijsdatabaseguide/OfflineApplicationCache/OfflineApplicationCache.html

实际上,我认为从技术上讲,此处的重新加载行为仍然存在,但由于所有资产都在本地缓存,因此您可能不会注意到这一点。

希望有所帮助!