Php + ajax methods for automatically saving articles

This article mainly introduces how to automatically save php + ajax content, which can be used to save the content in real time and prevent data loss in emergencies. it is a very practical technique, for more information about how to use php + ajax to automatically save files, see the example in this article. Share it with you for your reference. The specific analysis is as follows:

Php + ajax files are automatically saved to facilitate users and improve user experience. We use ajax to save a temporary data, like csdn, it can automatically save user data. in this case, power loss occurs, and no data edited by you will be lost.

This is a core part of automatically saving drafts,

Autosavetime (sec) is used to start timing.

ClearTimeout (autosavetimer); clears the timer

Document. getElementById ('autosavetimebox'). innerHTML = sec + "seconds"; get the autosavetimebox object on the page, and write a countdown to it

The code is as follows:

If (sec> 0 ){
Autosavetimer = setTimeout ("autosavetime (" + sec + "-1)", 1000 );
// Here is if when the sec> 0, the first second executes the autosavetime function, and will write the value of the sec-1 into the autosavetimebox
} Else {
Var title = document. getElementById ('title ');
If (title. value! = ''){
Autosave_post ();
} Else {
Document. getElementById ('autosavetimebox'). innerHTML = 'do not save ';
}
}

This part is when the sec> 0 condition is not true, huh, that is, when the sec <= 0, starts to save the draft, first checks whether the article title is blank, if it is not null, run the autosave_post () function. otherwise, write 'Do not save '.

The php code is as follows:

The code is as follows:

Var userAgent = navigator. userAgent. toLowerCase ();
Var is_opera = (userAgent. indexOf ('Opera ')! =-1 );
Var is_saf = (userAgent. indexOf ('applewebkit ')! =-1) | (navigator. vendor = 'Apple Computer, Inc .'));
Var is_webtv = (userAgent. indexOf ('webtv ')! =-1 );
Var is_ie = (userAgent. indexOf ('msie ')! =-1 )&&(! Is_opera )&&(! Is_saf )&&(! Is_webtv ));
Var is_ie4 = (is_ie) & (userAgent. indexOf ('msie 4 .')! =-1 ));
Var is_moz = (navigator. product = 'Gecko ')&&(! Is_saf ));
Var is_kon = (userAgent. indexOf ('konqueror ')! =-1 );
Var is_ns = (userAgent. indexOf ('compute') =-1) & (userAgent. indexOf ('mozilla ')! =-1 )&&(! Is_opera )&&(! Is_webtv )&&(! Is_saf ));
Var is_ns4 = (is_ns) & (parseInt (navigator. appVersion) = 4 ));
Var is_mac = (userAgent. indexOf ('Mac ')! =-1 );
If (is_ie &! Is_ie4) | is_moz | is_saf | is_opera)
{
Var allowajax = 1;
} Else {
Var allowajax = 0;
}
Var xmlHttp = false;
Function makeSendData (postData, url, functionName, httptype ){

Var posturl = url;
Try {
XmlHttp = new ActiveXObject ("Msxml2.XMLHTTP ");
} Catch (e ){
Try {
XmlHttp = new ActiveXObject ("Microsoft. XMLHTTP ");
} Catch (e2 ){
XmlHttp = false;
}
}
If (! XmlHttp & typeof XMLHttpRequest! = 'Undefined '){
XmlHttp = new XMLHttpRequest ();
}

If (! XmlHttp ){
Alert ('could not send an XMLHTTP request ');
Return false;
}

// Form submission method
XmlHttp. open (httptype, posturl, true );

// Triggers an event after the form is submitted.
Var changefunc = "xmlHttp. onreadystatechange =" + functionName; // from bob
Eval (changefunc );
XmlHttp. setRequestHeader ('content-type', 'application/x-www-form-urlencoded ');
XmlHttp. send (postData );
}
Function autosave_post ()
{
Var title = document. getElementById ('title'). value;
Var content = window. frames ["Editor"]. window. frames ["HtmlEditor" ..doc ument. getElementsByTagName ("BODY") [0]. innerHTML;
Var postTime = document. getElementById ('posttime'). value;
If (allowajax = 1)
{
Content = postencode (content );
Title = postencode (title );
Var post = "title =" + title + "& content =" + content + "& postTime =" + postTime + "";
Var url = "ajax. php? Act = autosave ";
MakeSendData (post, url, 'autosave', 'post ');
}
}
Function autosave ()
{
If (xmlHttp. readyState = 4)
{
If (xmlHttp. status = 200)
{
Var autoresponse = xmlHttp. responseText;
Var automessage = document. getElementById ('autosavetimebox ');
If (autoresponse. indexOf ("")! =-1)
{
Automessage. innerHTML = 'You have not added the information, do not save the draft ';
Return false;
}
If (autoresponse. indexOf ("")! =-1)
{
Automessage. innerHTML = 'saved successfully. you can load the draft in case of an accident ';
Finddraft ();
}
}
}
}
Function finddraft ()
{
If (allowajax = 1)
{
Var url = "ajax. php? Act = loaddraft ";
MakeSendData (null, url, 'loaddraft ', 'post ');
}
}
Function loaddraft ()
{
Var draftbox = document. getElementById ('Draft ');
If (xmlHttp. readyState <4)
{
Draftbox. innerHTML = 'load the draft ...';
}
If (xmlHttp. readyState = 4)
{
If (xmlHttp. status = 200)
{
Draftbox. innerHTML = xmlHttp. responseText;
}
}
}
Function cleardraft ()
{
If (allowajax = 1)
{
Var url = "ajax. php? Act = cleardraft ";
MakeSendData (null, url, 'nodraft ', 'post ');
}
}
Function nodraft ()
{
Var draftbox = document. getElementById ('Draft ');
If (xmlHttp. readyState <4)
{
Draftbox. innerHTML = 'Loading ...';
}
If (xmlHttp. readyState = 4)
{
If (xmlHttp. status = 200)
{
Draftbox. innerHTML = xmlHttp. responseText;
}
}
}
// Encode string
Function postencode (str ){
Str = encodeURIComponent (str );
If (is_moz) str = str. replace (/% 0A/g, "% 0D % 0A"); // from bob
Return str;
}

The automatically saved js code is as follows:

The code is as follows:

Var autosavetimer;
Function autosavetime (sec ){
ClearTimeout (autosavetimer );
Document. getElementById ('autosavetimebox'). innerHTML = sec + "seconds ";
If (sec> 0 ){
Autosavetimer = setTimeout ("autosavetime (" + sec + "-1)", 1000 );
} Else {
Var blogtitle = document. getElementById ('title ');
If (blogtitle. value! = ''){
Autosave_post ();
} Else {
Document. getElementById ('autosavetimebox'). innerHTML = 'do not save ';
}
}
}
Function startimer ()
{
Var starttime = document. getElementById ('autosavetimebox'). innerHTML;
If (starttime = 'saved successfully, you can load the draft when an accident occurs' | starttime = 'you have not added the information, do not save the draft ')
{
Starttime = '60 ';
} Else {
Starttime = starttime. replace ('second ','');
}
Var autosavefunbox = document. getElementById ('autosavefunbox ');
Autosavefunbox. innerHTML = 'stopped ';
Starttime = 0? Starttime = 60: starttime = starttime;
Autosavetime (starttime );
}
Function stoptimer ()
{
Var autosavefunbox = document. getElementById ('autosavefunbox ');
Autosavefunbox. innerHTML = 'start time ';
ClearTimeout (autosavetimer );
}

I hope this article will help you with php programming.