AutoSave/자동저장 기능 구현_javascript 기술

출처: http://www.fayland.org/journal/AutoSave.html

이 기능은 매우 일반적입니다. 이는 브라우저가 충돌하거나 제출에 실패하여 작성하기 위해 열심히 노력한 내용이 사라지는 것을 방지하기 위한 것입니다. Gmail에서도 사용할 수 있습니다.
텍스트 상자의 내용을 쿠키에 저장하는 것이 원칙입니다. 제출에 실패하면(브라우저 충돌이 원인일 수 있음) 다음에 해당 페이지를 방문할 때 가져올 것인지 묻는 메시지가 표시됩니다. 마지막으로 저장된 콘텐츠.
function AutoSave(it) { // 호출된 텍스트 상자를 참조합니다.
var _value = it.value; // 텍스트 상자의 값을 가져옵니다.
if (!_value) {
var _LastContent = GetCookie ('AutoSaveContent'); // 쿠키 값을 가져옵니다. GetCookie는 사용자 정의 함수입니다. 소스 코드를 참조하세요.

if (!_LastContent) return; , 새로운 시작을 의미합니다

if (confirm("Load Last AutoSave Content?")) { // 그렇지 않으면 가져올지 여부를 묻습니다
it.value = _LastContent;
return true;
}      
} else {

var expDays = 30;
var exp = new Date();
exp.setTime( exp.getTime() (expDays * 86400000) ) / / 24*60*60* 1000 = 86400000
varexpires=';expires='exp.toGMTString();

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

그리고 이 HTML은 다음과 같아야 합니다:

<br><script language=JavaScript src='/javascript/AutoSave.js'></script><br><form action="submit" method="POST" onSubmit="DeleteCookie('AutoSaveContent')"><br><textarea rows="5" cols="70" wrap="virtual" onkeyup="AutoSave(this);" onselect="AutoSave(this);" onclick="AutoSave(this);"></textarea><br><input type="submit"></form><br>

첫 번째 문장은 js를 가져옵니다. 두 번째 문장의 onSubmit은 쿠키가 제출되었는지 여부를 나타내며, DeleteCookie도 사용자 정의 함수입니다. 소스코드를 확인하세요.
텍스트 영역의 Onkeyup은 새로 작성된 텍스트를 저장하기 위해 키를 눌렀을 때 자동 저장에 액세스하는 것을 의미합니다.
Onselect 및 onclick은 새로 방문하는 동안 가져올 자동으로 저장된 텍스트를 결정하는 데 사용됩니다.

그렇습니다. 즐겨보세요!

소스 코드: http://www.fayland.org/javascript/AutoSave.js