Question

我正在尝试为拥有html5本地存储空间的旅行者制作日记。

这个想法是你填写表格：姓名，图片，日期，地点。在另一页上，将显示此信息

我被卡住了，因为我不知道如何为1键提供更多价值以及如何在信息发布后自动更改密钥表格已保存。

<form id="localStorage" method="post" action="">
    <label>Kies foto:</label>
    <br/>
    <input type='file' id="afbeelding" />
    <br/>
    <br/>
    <label>Onderschrift:</label>
    <br/>
    <input type="Onderschrift" name="Onderschrift" id="Onderschrift" class="Opslaan" required />
    <br/>
    <br/>
    <button onclick="opslaan()" type="button">Verstuur</button>
</form>

function opslaan() {
    var inputOnderschrift = document.getElementById("Onderschrift");
    localStorage.setItem("onderschrift", inputOnderschrift.value);
}

Answer 1

据我所知，本地存储用于字符串键/值对。虽然您可以构建自定义对象，但将其字符串化并存储它，类似于：

var myObject = { name: 'myname', address: 'myaddress' };
localStorage.setItem("myObject", JSON.stringify(myObject));

然后在返回途中使用JSON.parse();将其返回到对象中并重新填充表单。

Answer 2

您可以使用用户数据存储对象（JSON字符串化）。

例如：

var userData = {
  'name': '',
  'picture': '',
  'date': '',
  'location': ''
};

var inputOnderschrift = document.getElementById('Onderschrift');
userData.name = inputOnderschrift.value;

var inputPicture = document.getElementById('Picture');
userData.picture = inputPicture.value;

// etc.

localStorage.setItem('userData', JSON.stringify(userData));

在下一页中，您可以检索如下数据：

var userData = JSON.parse(localStorage.getItem('userData'));
var name = userData.name;
var picture = userData.picture;

Answer 3

我制作了一个数组，将更多的值放在1个键中并且有效

如何向本地存储中的密钥发送多个值？

3 个答案: