AutoSave/自动存储功能实现

转自:http://www.fayland.org/journal/AutoSave.html

这个功能很常见。是为了防止浏览器崩溃或提交不成功而导致自己辛辛苦苦写就的东西消失掉。Gmail里也这个东西。
它的原理是将该文本框的东西存储进一个Cookie.如果没提交成功（原因可能是浏览器崩溃），下次访问该页面时询问是否导入上次存储的东西。
functionAutoSave(it){//it指调用的文本框
    var_value=it.value;  //获得文本框的值
  if(!_value){
    var_LastContent=GetCookie("AutoSaveContent");//获得cookie的值，这里的GetCookie是个自定义函数，参见源代码

    if(!_LastContent)return;//如果该cookie没有值，说明是新的开始

    if(confirm("LoadLastAutoSaveContent?")){//否则询问是否导入
      it.value=_LastContent;
      returntrue;
    }      
  }else{

    varexpDays=30;
    varexp=newDate();
    exp.setTime(exp.getTime()+(expDays*86400000));//24*60*60*1000=86400000
    varexpires=";expires="+exp.toGMTString();

    //SetCookie这里就是设置该cookie
    document.cookie="AutoSaveContent="+escape(_value)+expires;
  }
}

而这HTML中应当如此：

<scriptlanguage=JavaScriptsrc="/javascript/AutoSave.js"></script>
<formaction="submit"method="POST"onSubmit="DeleteCookie("AutoSaveContent")">
<textarearows="5"cols="70"wrap="virtual"onkeyup="AutoSave(this);"onselect="AutoSave(this);"onclick="AutoSave(this);"></textarea>
<inputtype="submit"></form>

第一句导入js,第二句的onSubmit指如果提交了就删除该cookie,而DeleteCookie也是自定义的一个函数。参见源代码。
textarea里的onkeyup是指当按键时访问AutoSave,用以存储新写入的文字。
而onselect和onclick用以新访问时确定导入自动保存的文字。

大致就是如此。Enjoy!

源代码：http://www.fayland.org/javascript/AutoSave.js