Php + ajax implement google search function 1 [original]. Original Works Original site: www.111cn.cn author: Noodle love rabbit QQ: 271728967 note: Reprint please indicate that the original www.111cn.cn is now under heavy snow in Changsha, there is nothing to go home at night //
Original works
Original site: www.111cn.cn
Author: Noodle love rabbit QQ: 271728967
Note: Reprint please explain the original out of http://www.111cn.cn
//
Now there is heavy snow in Changsha, and there is nothing to do when I go home at night. I wrote a BBS in the company during the day and completed a copy. suddenly yesterday I heard a netizen say that it would be nice to achieve the google effect, today, I was bored and thought about it. I thought it was nothing to do with ajax. I tried to write it. to tell the truth, I learned ajax for a short time and I only understood it, after reading this, don't lose the stone. let's lose your wallet. you have no money to use it during the Chinese New Year.) haha. well, I will not talk much about the topic below.
P in commit is not that simple. let's look at the code below.
Step 1: Create a data table: test
Create table 'test '(
'Id' int (4) not null auto_increment,
'Title' varchar (50) default NULL,
Primary key ('id ')
) ENGINE = InnoDB default charset = gb2312 AUTO_INCREMENT = 5;
After the data warehouse is successfully created, we will create the test.html file. This file is very simple. it is a form and a p and CSS file.
The above CSS is used to control the effect,
The content above is as follows.
Step 2: processing and calling of js and xmlhttp.
Create xmlhttp. I talked about this function last time when I talked about ajax + php imitating the window file manager. I also talked about it during user registration. I will not talk about it here. For the specific address, please go:
Var xmlHttp = false;
Function ajaxcreate (){
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 (\ 'create Xmlhttp Fail \ '); return false ;}
}
The following sugguest () function is used to obtain the key value and send it to the post file for processing, and then call the returnstate () function.
Function sugguest (){
Ajaxcreate ();
Var xmvalue = document. getElementById ("key"). value;
Var url = "post. php? Key = "+ encodeURI (xmvalue) +" rnd = "+ Math. random ();
If (xmvalue = null | xmvalue. length> 20 | xmvalue = "") return false;
XmlHttp. open ("POST", url, true );
XmlHttp. setRequestHeader ("Content-Type", "application/x-www-form-urlencoded ");
XmlHttp. send (xmvalue );
XmlHttp. onreadystatechange = returnstate;
}
The following returnstate () function is used to determine whether the xmlhttp status is equal to or not. 4 indicates that the sending is successful. In fact, another 200 indicates that the receiving is complete.
Function returnstate (){
If (xmlHttp. readyState! = 4 ){
Document. getElementById ("sug"). innerHTML = "plase wait ....";
}
If (xmlHttp. readyState = 4 ){
Document. getElementById ("sug"). innerHTML = xmlHttp. responseText;
}
}
The following functions are some basic operations. I will not talk about them anymore,
Function fillin (str ){
Document. getElementById (\ 'key \ '). value = str;
Obj = document. getElementById (\\\ 'sug \\\');
Obj. innerHTML = \\\'\\\';
Obj. style. display =\\ 'none \\\';
}
Function other (){
Document. getElementById (\ 'sug \ '). style. display =\\ 'block \\\';
}
Function losefouse (){
SetInterval ("func ()", 4000 );
Var time = setInterval ("func ()", 1000 );
ClearTimeout (time );
}
Function func (){
Ob = document. getElementById (\\\ 'sug \\\');
Ob. style. display =\\ 'none \\\';
}
The last part is the post. php file, followed by the next one.
Php + ajax implement google search function 2 [original]
Effect address: http://www.111cn.cn/test/test.html
Http://www.bkjia.com/PHPjc/631914.htmlwww.bkjia.comtruehttp://www.bkjia.com/PHPjc/631914.htmlTechArticle// original works site Original: www.111cn.cn author: love rabbit noodles QQ: 271728967 note: Reprint please indicate that the original http://www.111cn.cn/now under the heavy snow in Changsha ah, go home at night there is nothing...