2010-02-05 116 views
8

我很想测试HTML离线存储和缓存,以开发原型来展示html5的离线web应用程序功能。体面的html5离线存储和缓存示例

我发现一些具体的WebKit的样本,但我挣扎着找到任何像样的代码示例,即使在Firefox 3.6中

在所有的工作对于一个样品,我很高兴有一些作品与以下内容:

  • 我们公司广泛使用jquery,所以我更喜欢使用该库或纯JavaScript的示例。
  • 它应该在Firefox上至少工作(3.6+是罚款)

任何人都可以点我的一些链接,提供一些指导和代码示例?

回答

1

我建议您查看CSS NinjaFont Dragr demonstration,它虽然主要用于演示使用Firefox的HTML5的File API,但也使用脱机存储。

如果没有别的,这个人知道他的东西,并可以提出很好的例子。

3

我发现这个例子中,它是最简单的/最好的事情我已经看到了本地存储。它只演示本地(持久)存储,而不是数据库存储。另外,如果你想会话存储,只需更改“的localStorage”来的sessionStorage”

的JavaScript不能我认为,任何简单。

w3.org example

是的,它工作正常FF(在)

0

现在所有的主流浏览器都支持了解离线存储,所以我建立了一个用于处理表单状态的jQuery插件。http://www.jasonsebring.com/dumbFormState源代码很小且易于理解。

我推荐使用道格拉斯克罗克福德的JSON2.stringify: https://github.com/douglascrockford/JSON-js来做序列化的方法来获取JavaScript中的一个对象并将其转换为JSON字符串。然后可以将该保存要么window.sessionStorage或window.localStorage容易像这样:

//设置数据

window.sessionStorage [ 'MYDATA'] = JSON.stringify(someObject);

//得到它回

someObject = jQuery.parseJSON(window.sessionStorage [ 'MYDATA']);

另一件需要考虑的就是命名您的密钥。对于我正在做的事情,我希望它自动生成,所以键名是基于'dumbFormState-'+ window.location.pathname + ' - '+表单索引保存的,以确保密钥自动唯一,然后您可以循环执行它们通过检查与他们键匹配的前缀'dumbFormState-'来删除它们,因为您不想删除那些人们可能使用的其他东西。

希望能有所帮助。

+0

对于较新的浏览器,不建议使用JSON2.stringify的crockfords api。这个API现在在浏览器 – Kiran 2011-12-13 16:40:08

+0

的本质上得到了支持,但脚本使用本机(如果支持)。 - > http://stackoverflow.com/questions/1480393/alternatives-of-json-stringify-in-javascript – 2011-12-13 18:46:55