I am trying to use local storage to be able to save/load multiple sets of form inputs in a web app. I have found a couple references but I'm not sure how to apply them to my needs. Also, most examples I've found here concern storing a single set of settings which then are loaded the next time the page/app is loaded:
我正在尝试使用本地存储来保存/加载web应用程序中的多组表单输入。我找到了一些引用，但我不确定如何将它们应用到我的需要中。此外，我在这里发现的大多数示例都涉及存储一组设置，这些设置将在下次加载页面/应用程序时加载:
www.graphicpush.com/using-localstorage-api-as-a-light-database
www.paperkilledrock.com/2010/05/html5-localstorage-part-three/
www.graphicpush.com/using-localstorage-api-as-a-light-database www.paperkilledrock.com/2010/05/html5-localstorage-part-three/
The first link (graphicpush) is what I have tried to use to store multiple form input values but I'm not even sure if the values are being placed in the database. And once they are actually placed in the database, I'm not sure how to selectively recall a unique ID from the database and display it in the form.
第一个链接(graphicpush)是我用来存储多个表单输入值的方法，但我甚至不确定这些值是否被放在数据库中。一旦它们被实际放置到数据库中，我不确定如何有选择地从数据库中检索一个惟一的ID并以表单显示它。
The second link, I've looked at and is very close to what I need as well and I'm having the same problems as previously described.
第二个链接，我已经看过了，也非常接近我所需要的，我遇到了和前面描述的一样的问题。
My web app is located at http://www.sovascreen.com/estimator and you can view the attempt at localstorage in the "save.js" file. I know I'm very far off so please be kind.
我的web应用程序位于http://www.sovascreen.com/estimator，您可以在“save”中查看对localstorage的尝试。js”文件。我知道我离这儿很远，所以请见谅。
I feel like this should be fairly simple but I don't have a firm grasp on what I should be doing so any help would be appreciated.
我觉得这应该是相当简单的，但我不知道我应该做什么，所以任何帮助都会受到感激。
2 个解决方案
#1
3
Local storage is remarkably simple. A primer:
本地存储非常简单。引物:
// set
localStorage.setItem('blah', 'blahblah')
// check if it is set
localStorage.getItem('blah')
// check how many items are stored
localStorage.length
// another way to get the item
localStorage.key(0);
// remove the item
localStorage.removeItem('blah')
Here's a Fiddle with a tiny library I wrote for you to interact with. It allows objects or strings to be added to localstore via JSON.parse and stringify.
这是我为你写的一个小图书馆的小提琴。它允许通过JSON将对象或字符串添加到localstore。解析函数,把。
Hit 'run' a few times and the output should look like:
点击“run”几次，输出如下:
blah is not set. setting to blahblah
["blah"]
blah is set to blahblah
[]
blah is not set. setting to blahblah
["blah"]
blah is set to blahblah
[]
#2
0
The page isn't loading a save.js file for me. Can you confirm that it's working as intended?
页面没有加载保存。js文件给我。你能确认它是否正常工作吗?
If you're using Chrome, the developer tools allow you to view the contents of localStorage. Click Resources > Local Storage. It will show you all of the key/value pairs you've stored, and you can delete them as well.
如果您正在使用Chrome，开发人员工具允许您查看localStorage的内容。单击Resources >本地存储。它将显示您所存储的所有键/值对，您也可以删除它们。
#1
3
Local storage is remarkably simple. A primer:
本地存储非常简单。引物:
// set
localStorage.setItem('blah', 'blahblah')
// check if it is set
localStorage.getItem('blah')
// check how many items are stored
localStorage.length
// another way to get the item
localStorage.key(0);
// remove the item
localStorage.removeItem('blah')
Here's a Fiddle with a tiny library I wrote for you to interact with. It allows objects or strings to be added to localstore via JSON.parse and stringify.
这是我为你写的一个小图书馆的小提琴。它允许通过JSON将对象或字符串添加到localstore。解析函数,把。
Hit 'run' a few times and the output should look like:
点击“run”几次，输出如下:
blah is not set. setting to blahblah
["blah"]
blah is set to blahblah
[]
blah is not set. setting to blahblah
["blah"]
blah is set to blahblah
[]
#2
0
The page isn't loading a save.js file for me. Can you confirm that it's working as intended?
页面没有加载保存。js文件给我。你能确认它是否正常工作吗?
If you're using Chrome, the developer tools allow you to view the contents of localStorage. Click Resources > Local Storage. It will show you all of the key/value pairs you've stored, and you can delete them as well.
如果您正在使用Chrome，开发人员工具允许您查看localStorage的内容。单击Resources >本地存储。它将显示您所存储的所有键/值对，您也可以删除它们。