从localStorage加载的文本在刷新时消失

时间:2017-04-24 16:58:56

标签: javascript jquery html local-storage

有一个bootstrap模式,它有3个输入:名称,图像和描述。我已经想出如何将所有内容保存到本地存储并将表单输入加载到我的网页,但是,文本元素在刷新时消失,所以我希望我能得到有关此的提示。

apply.onclick = function () {                       //function executed when form submitted
    var name = document.getElementById("name2").value;      //save name to a var
    var description = document.getElementById("description2").value;
    localStorage.setItem("name", name);                    //set name to localStorage
    localStorage.setItem("description", description);

    updateProduct(); //function to load into divs from local storage
}

function updateProduct(){
    $("#title2").html(localStorage.name);
    $("#desc2").html(localStorage.description); //load name&desciption into divs
}

这会成功地在各自的div中设置名称和描述,但是一旦页面刷新,文本将被删除并重置为“apply”之前的任何内容。有没有不同的保存和方法?从我应该使用的本地存储加载?

1 个答案:

答案 0 :(得分:1)

您的页面加载时需要调用updateProduct函数。目前,您只是在onclick处理程序中调用它,而不是您在此处显示的内容。

您可以通过应用以下技术来实现:

document.onreadystatechange = function () {
    if (document.readyState == "interactive") {
        initApplication();
    }
}

您希望在应用程序初始化期间应用的任何内容都应该在您定义的initApplication函数中。

您可以在MDN上阅读此here