Question

我只是盯着建立待办事项清单。我的approch是将数据保存在第一个选项卡中并在第二个选项卡上显示。我能够将数据保存到本地存储中。但数据对我来说正在被覆盖。知道我在哪里做错了。

这是我的jsFiddle

使用过的HTML

<form id="todo-form">
                <input type="text" name="t_title" id="t_title" placeholder="Title" />
                <textarea placeholder="Description" name="t_description" id="t_description"></textarea>
                <input type="button" class="btn btn-primary" value="Add Task"/>
              </form>

要保存数据我的Javascript是

$(".btn-primary").click(function(){
    var formId = ("todo-form");
var inputs = $("#" + formId + " :input"),
            id, title, description, tempData,
            data = {} ;

        title = inputs[0].value;
        description = inputs[1].value;

        id = new Date().getTime();

        tempData = {
            id : id,
            title: title,
            description: description
        };

        // Saving element in local storage
        data[id] = tempData;
        localStorage.setItem("todoData", JSON.stringify(tempData));

});

Answer 1

LocalStorage是一个键/值对存储，因此对于每个键，您只能有一个值。

您始终将值设置为键'todoData'，因此您始终将最后一个值替换为当前值。

如果您只想对所有数据使用一个密钥，则应该从LocalStore解析JSON，附加第二个项目，然后将它们再次存储在LocalStorage上。或者你可以使用多个键。

除此之外，您的代码中还有两个问题：

您正在保存错误的对象，您应该保存data而不是。{ tempData
您没有从中重新创建data对象加载页面时的localStorage

http://jsfiddle.net/RmCA7/4/

值越来越多，将数据保存到本地存储中

1 个答案: