在使用表单卸载javascript之前更新缓存

时间:2014-06-30 18:08:40

标签: javascript caching

我有一个表单,由用户通过javascript更新。实际上,用户可以动态添加一些字段。到目前为止,一切都很好。假设我的表单有一个字段。用户再添加一次该字段。他验证了这一点,他用他的表格的结果到达了一个新的页面但后来意识到他做错了并返回(例如浏览器上一个按钮)。

表单仍然显示上一个输入,但只显示一个字段。 (他用javascript添加的那个不再出现了)我可以在提交表单后以某种方式更新缓存,这样如果用户返回,他可以看到他刚才提交的相同表单吗?

干杯!

1 个答案:

答案 0 :(得分:1)

每当您的代码更改表单时,您应该调用一个将当前表单代码存储在localStorage中的函数。每当打开页面时,您应该检查localStorage是否包含该信息,如果是,则将表单代码设置为存储的代码。这不会更新浏览器的缓存,但会将信息存储在客户端。

$(document).ready(function(){

    $("#something").click(function(e){
        e.preventDefault(); 
        // do stuff: add form elements, bla bla bla;
        updateStorage();
    });
    $("#clearStorage").click(function(e){
        e.preventDefault();
        localStorage.removeItem("theUsersPage");
    });

    function updateStorage(){
        var current;
        current = $("#container").html();

        localStorage.setItem("theUsersPage", current);
    }

    function loadFromStorage(){
        var old = localStorage.theUsersPage;
        if(old){
            $("#container").html(old);
        }
    }

    loadFromStorage();

});

jsfiddle:http://jsfiddle.net/JjxV8/1/