Add <meta name = "save" content = "history">
Add css: input {behavior: url (# default # savehistory )};
E.g. The page contains <input type = text id = "txttestsavehistory"/>
Enter the input value and refresh the page. The input value is still in
Example
The code is as follows: |
Copy code |
<! Doctype html public "-// W3C // dtd html 4.01 Transitional // EN"> <Html> <Head> <Meta http-equiv = "Content-Type" content = "text/html; charset = utf-8"/> <Meta name = "save" content = "history"> <Title> </title> <Mce: style type = "text/css"> <! -- Input {behavior: url (# default # savehistory )}; --> </Mce: style> <style type = "text/css" mce_bogus = "1"> input {behavior: url (# default # savehistory)}; </style> </Head> <Body> <DIV style = "float: left" mce_style = "float: left"> <Ul> <Li> <label style = "width: 100px"> hhhhh </label> <input type = "text"> </li> <Li> <label style = "width: 100px"> sssssssssss </label> <input type = "text"> </li> </Ul> </DIV> |
Another real implementation method is the JavaScript ajax save draft function.
The first is the form page:
The code is as follows: |
Copy code |
<! -- Text field for writing an article --> <Textarea cols = "10" rows = "6" id = "content"> </textarea> <! -- AutoSaveMsg displays the returned INFORMATION --> <Div id = "AutoSaveMsg"> </div> <Input type = "button" onclick = "AutoSaveRestore ();" value = "restore the last saved draft"> <! -- Place the JS code after all objects to avoid the error that the object does not exist when the page is not loaded. --> <! -- AJAX --> <Script type = "text/javascript" src = "ajaxrequest. js"> </script> <! -- Automatically save the code --> <Script type = "text/javascript" src = "autosave. js"> </script> |
===== Save the following code as autosave. js ====
The code is as follows: |
Copy code |
// FormContent object to save Var FormContent = document. getElementById ("content "); // Display the object of the returned information Var AutoSaveMsg = document. getElementById ("AutoSaveMsg "); // Automatic storage interval Var AutoSaveTime = 60000; // Timer object Var AutoSaveTimer; // First set the automatic save status SetAutoSave (); // Automatically save the function Function AutoSave () { // If the content is blank, no processing is performed and a direct response is returned. If (! FormContent. value) return; // Create an AJAXRequest object, Var ajaxobj = new AJAXRequest; Ajaxobj. url = "inc/autosave. asp "; Ajaxobj. content = "postcontent =" + escape (FormContent. value ); Ajaxobj. callback = function (xmlObj) { // Display feedback AutoSaveMsg. innerHTML = xmlObj. responseText; } Ajaxobj. send (); } // Set the automatic save status function Function SetAutoSave () { AutoSaveTimer = setInterval ("AutoSave ()", AutoSaveTime ); }
// Restore the last saved draft Function AutoSaveRestore () { // Create an AJAXRequest object Var ajaxobj = new AJAXRequest; AutoSaveMsg. innerHTML = "recovering... please wait ...... " Ajaxobj. url = "inc/autosave. asp "; Ajaxobj. content = "action = restore "; Ajaxobj. callback = function (xmlObj) { AutoSaveMsg. innerHTML = "restore the last saved successfully "; // If the content is empty, the content of textarea is not rewritten. If (xmlObj. responseText! = "") { // Restore draft FormContent. value = xmlObj. responseText; } } Ajaxobj. send () } |
The principle is very simple, that is, when we set a few seconds, we will automatically save the data in the specified text box, which is more suitable than the one above, of course, we only wrote JavaScript code above to process some of the php code, which is the same as storing other data.