高仿 google suggest ajax 示例

　　前段時間想用google suggest在網(wǎng)上找了很多都不盡人意,于是自己花了些時間寫了一個,跟google suggest 基本一樣,后面的約多少結(jié)果非本程序范圍哦。

　　需要修改的地方有

　　javascript.js

　　var url="ajax.asp"; //后臺地址

　　var time_delayajax=300; //搜索延遲

　　var time_delayupdown=100; //方向鍵延遲

　　obj_div.style.top = (xtop + 20) + "px"; //20差不多是輸入框的高度,請根據(jù)實際情況調(diào)整

　　ajax_xmlhttp.send("sift_value="+escape(temp_value)); //提交到后臺的值

　　dd=d+"

　　后臺輸出結(jié)果格式必需為'文本1,文本2'..... 'java,2''javascript,11''java示例,22'等

　　default.css

　　.ajaxsearch {

　　 width:300px; //提示層的寬度

　　}

　　首頁index.html

　　腳本javascript.js

　　///////////////////////////////搜索提示框/////////////////////////////////

　　var obj_div; //提示層對象

　　var obj_input; //輸入框?qū)ο?

　　var main_delay; //判斷值變化延遲對象

　　var ajax_delay; //ajax延遲搜索對象

　　var updown_delay; //方向鍵延遲對象

　　var ajax_xmlhttp; //ajax對象

　　var div_word=null; //當(dāng)前提示層對應(yīng)的搜索值

　　var li_num=-1; //偽光標位置,提示層被選中的li序號,從0開始

　　var li_down=-1; //鼠標按下提示層的序號

　　var value_ed=''; //輸入框延遲前的值

　　var value_ing=''; //輸入框當(dāng)前的值

　　var value_unexit=''; //搜索過沒有結(jié)果的值開頭

　　var updown_run=false; //允許方向鍵上下

　　var ajax_run=false; //true為正常進程,false停止ajax

　　var ajax_run_ing=false; //true正在運行,false空閑

　　var input_focus=false; //文本框焦點

　　var url='ajax.asp'; //后臺地址**********************************************************

　　var time_delayajax=300; //搜索延遲**********************************************************

　　var time_delayupdown=100; //方向鍵延遲********************************************************

　　var $=function(Fun_id){

　　 return document.getElementById(Fun_id);

　　}

　　try{

　　 ajax_xmlhttp= new ActiveXObject('Msxml2.XMLHTTP');

　　}catch(e){

　　 try{

　　 ajax_xmlhttp= new ActiveXObject('Microsoft.XMLHTTP');

　　 }catch(e){

　　 try{

　　 ajax_xmlhttp= new XMLHttpRequest();

　　 }catch(e){ajax_xmlhttp=null;}

　　 }

　　}

　　////////////////////////創(chuàng)建提示層////////////////////////

　　function createajaxdiv(){

　　 var create_div = document.createElement('div');

　　 create_div.type = 'div';

　　 var promptdiv = document.body.appendChild(create_div);

　　 promptdiv.className = 'ajaxsearch';

　　 obj_div=promptdiv;

　　}

　　////////////////////////設(shè)置提示層位置////////////////////////

　　function removediv(){

　　 if(!obj_div || !obj_input)return false;

　　 if(obj_div.style.display=='none')return false;

　　 var obj=obj_input;

　　 var xtop=0;

　　 var xleft=0;

　　 while(obj){

　　 xtop += obj['offsetTop'];

　　 xleft += obj['offsetLeft'];

　　 obj = obj.offsetParent;

　　 }

　　 obj_div.style.left = xleft + 'px';

　　 obj_div.style.top = (xtop + 20) + 'px'; //20差不多是輸入框的高度,請根據(jù)實際情況調(diào)整************************************************************8

　　 li_down=-1;

　　}

　　////////////////////////隱藏提示層////////////////////////

　　function hideajaxdiv(){

　　 obj_div.style.display='none';

　　 li_down=-1;

　　}

　　////////////////////////設(shè)置被選