将数据保存到本地存储

时间:2014-05-19 17:36:33

标签: javascript jquery local-storage

我试图在本地存储中设置变量,但功能没有运行,我试图获得价值但没有运气,如何在本地存储中保存字段?

function setPerson(){
var person = { 'name': getElementById('name'), 'photo': getElementById('photo')};

// Put the object into the storage
    alert(person);
    localStorage.setItem('person', JSON.stringify(person));
};

HTML  在HTML中,我从字段中将值放入标记中并填充它们,但是当我尝试获取它们并保存它们时,没有任何事情发生......

我还尝试在那里输出固定值然后显示警报,但是它只显示对象而不是值

var testObject = { 'one': 1, 'two': 2, 'three': 3 };

// Put the object into storage
localStorage.setItem('testObject', JSON.stringify(testObject));

// Retrieve the object from storage
var retrievedObject = localStorage.getItem('testObject');
alert('retrievedObject: ', JSON.parse(retrievedObject));;

5 个答案:

答案 0 :(得分:16)

您可以像这样使用localStorage:

// Retrieve your data from locaStorage
var saveData = JSON.parse(localStorage.saveData || null) || {};

// Store your data.
function saveStuff(obj) {
  saveData.obj = obj;
  // saveData.foo = foo;
  saveData.time = new Date().getTime();
  localStorage.saveData = JSON.stringify(saveData);
}

// Do something with your data.
function loadStuff() {
  return saveData.obj || "default";
}

<强> jsFiddle

答案 1 :(得分:3)

首先,您应该使用console代替alert

并且,如果您想在某处使用检索到的对象,您最好将其存储在变量中:

var testObject = { 'one': 1, 'two': 2, 'three': 3 };
localStorage.setItem('testObject', JSON.stringify(testObject));
var retrievedObject = JSON.parse(localStorage.getItem('testObject'));
console.log('retrievedObject: ', retrievedObject);

答案 2 :(得分:1)

W3C Schools为您提供有关如何使用html和本地存储的详细示例。

w3cSchools - Local Storage

答案 3 :(得分:0)

问题是getElementById返回一个HTML元素,它是一个对象。

然后,JSON.stringify将尝试迭代自己的属性。

但可能,他们没有(除非你手动添加)。

由于您说它们是字段,因此您可以尝试保存其value

var person = {
    name: document.getElementById('name').value,
    photo: document.getElementById('photo').value
};

答案 4 :(得分:0)

getElementById应更改为

    document.getElementById

这也将为您提供整个DOM元素。我假设你想要标签中的内容,所以我会说使用

    document.getElementById('name').innerHTML

代替。 当您尝试对其进行字符串化时,仅引用DOM元素会给出循环结构错误。

我确认的示例代码有效:

<html>
<head>
</head>
<body>
<p id="name">Hello</p>
<p id="photo">photo</p>
<script>

function setPerson(){
var person = { 'name': document.getElementById('name').innerHTML, 'photo':    document.getElementById('photo').innerHTML};

// Put the object into storage
localStorage.setItem('person', JSON.stringify(person));
}
setPerson()
</script>
</body>
</html>
相关问题