One, form part (index.html)
The first is a form Fill page, with a div with ID autosavemsg to display the return information, and a checkbox with an ID of draft_autosave to determine whether to save automatically, and then name the textarea ID as message. In order to meet the needs of multiple users at the same time, plus the user name, each user's draft separately saved. To illustrate the convenience, here are some cosmetic things to remove, so that looks more clear
<!--user name defaults to Noname-->
User name:
<input type= "text" name= "MemName" id= "MemName"
Size= "value=" "NONAME" disabled= "true"/>
<!--invoke the Auto Save State setting function in the onclick event of the AutoSave option-->
<input onclick= "Setautosave (); type= checkbox" id= "Draft_autosave" value= "1" checked= "true"/> automatically save?
Content:
<textarea cols=40 rows=8 id= "message" > your edited content will be automatically saved in order to restore </textarea><br/><br
<!--autosavemsg display return information-->
<div id= "autosavemsg" ></div><br/>
<input type= "Submit" onclick= "Save ();" Value= "Save"/>
<!--call function to restore the last saved draft-->
<input type= "button" onclick= "Autosaverestore ();" value= "Restore"/>
</div>
</div>
<!--Place the JS code behind all objects to prevent errors that do not exist when the page is not loaded-->
<!--Ajax class-->
<script type= "Text/javascript" src= "Ajaxrequest.js" ></script>
<!--automatically save code-->
<script type= "Text/javascript" src= "Autosave.js" ></script>
II. Automatic save Code (AUTOSAVE.JSP):
Set Global variables First
The Content object to save Formcontent
var formcontent;
Display objects that return information
var Autosavemsg=document.getelementbyid ("Autosavemsg");
User name
var Memname=document.getelementbyid ("MemName"). Value;
Automatic save time interval
var autosavetime=10000;
Timer Object
var Autosavetimer;
Set up an automatic save state first
Setautosave ();
Auto Save function
function AutoSave () {
Formcontent=document.getelementbyid ("message");
If the content or user name is empty, it is not processed and returned directly
if (! Formcontent.value!memname) return;
Creating Ajaxrequest Objects
var ajaxobj=new ajaxrequest;
Ajaxobj.url= "autosave.jsp";
Ajaxobj.content= "Action=autosave&memname=" +memname+ "&postcontent=" +formcontent.value;
Ajaxobj.callback=function (xmlobj) {
Show feedback Information
Autosavemsg.innerhtml=xmlobj.responsetext;
}
Ajaxobj.send ();
}
Set Auto Save state function
function Setautosave () {
Do you want to save it automatically?
if (document.getElementById ("Draft_autosave"). Checked==true)
Yes, set the timer