Php + ajax methods for automatically saving articles

Source: Internet
Author: User
Tags encode string
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.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.