将多个用户输入保存到本地存储中

Save more than one user input into local storage

本文关键字：存储 保存 用户 输入      更新时间：2023-09-26

我想知道是否有人能帮我处理本地存储。我希望能够将多个用户值存储到本地存储中，并单独显示它们，这样它们就可以用作按钮/链接。下面是我尝试过的一些代码：

    locatArray = new Array();
    function save() {
        var fieldValue = document.getElementById("input").value;
        var locatItem = locatArray.push(fieldValue);
        localStorage.setItem("text", JSON.stringify(locatArray));
    }
    window.onload = function load() {
        var storedValue = JSON.parse(localStorage.getItem("text"));
        if(storedValue) {
            document.getElementById("display").innerHTML = (storedValue);
        }

此代码允许用户在一个键中存储多个值。但是，由于它是一个数组，当刷新页面并且用户输入不同的数据时，本地存储值将被覆盖。此外，每个值都不能单独访问。

我刚开始使用本地存储，我想知道是否有人能帮我。

您需要更新数据，而不是覆盖它。实现一些同步机制，首先从localStorage获取数据，然后推送新项并再次存储更新后的数据，而不覆盖存储的数据。

若你们想删除一些项目，做同样的事情。从localStorage获取阵列，然后删除您不再需要的项目，然后再次将阵列存储在localStorage中。

使用您的代码：weather_urls作为密钥。

这将更新存储在本地存储中的阵列

function save() {
    var fieldValue = document.getElementById("input").value;
    var arrayOfLinks = localStorage.getItem("weather_urls");
    if(!arrayOfLinks){
        arrayOfLinks = []; // this is better way how to declare array not new Array()
    }
    arrayOfLinks.push(fieldValue);
    localStorage.setItem("weather_urls", arrayOfLinks);
}
window.onload = function load() {
    var storedValue = localStorage.getItem("weather_urls");
    if(storedValue) {
        document.getElementById("display").innerHTML = storedValue;
    }
相关文章：