书签 分享 收藏 举报 版权申诉 / 13

类型仿google自动提示.docx

  • 文档编号:7590701
  • 上传时间:2023-01-25
  • 格式:DOCX
  • 页数:13
  • 大小:20.48KB
 

14. 

15. 

脚本javascript.js

1.///////////////////////////////搜索提示框///////////////////////////////// 

2.var obj_div;     //提示层对象 

3.var obj_input;     //输入框对象 

4.var main_delay;     //判断值变化延迟对象 

5.var ajax_delay;     //ajax延迟搜索对象 

6.var updown_delay;    //方向键延迟对象 

7.var ajax_xmlhttp;    //ajax对象 

8.var div_word=null;    //当前提示层对应的搜索值 

9.var li_num=-1;     //伪光标位置,提示层被选中的li序号,从0开始 

10.var li_down=-1;     //鼠标按下提示层的序号 

11.var value_ed="";    //输入框延迟前的值 

12.var value_ing="";    //输入框当前的值 

13.var value_unexit="";   //搜索过没有结果的值开头 

14.var updown_run=false;   //允许方向键上下 

15.var ajax_run=false;    //true为正常进程,false停止ajax 

16.var ajax_run_ing=false;   //true正在运行,false空闲 

17.var input_focus=false;   //文本框焦点 

18.var url="ajax.asp";    //后台地址********************************************************** 

19.var time_delayajax=300;   //搜索延迟********************************************************** 

20.var time_delayupdown=100;  //方向键延迟******************************************************** 

21. 

22.var $=function(Fun_id){ 

23. return document.getElementById(Fun_id); 

24.} 

25.try{ 

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

27.}catch(e){ 

28. try{ 

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

30. }catch(e){ 

31.  try{ 

32.   ajax_xmlhttp= new XMLHttpRequest(); 

33.  }catch(e){ajax_xmlhttp=null;} 

34. } 

35.} 

36.////////////////////////创建提示层//////////////////////// 

37.function createajaxdiv(){ 

38. var create_div = document.createElement("div"); 

39. create_div.type = "div"; 

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

41. promptdiv.className = "ajaxsearch"; 

42. obj_div=promptdiv; 

43.} 

44.////////////////////////设置提示层位置//////////////////////// 

45.function removediv(){ 

46. if(!

obj_div || !

obj_input)return false; 

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

48. var obj=obj_input; 

49. var xtop=0; 

50. var xleft=0; 

51. while(obj){ 

52.  xtop += obj["offsetTop"]; 

53.  xleft += obj["offsetLeft"]; 

54.  obj = obj.offsetParent; 

55. } 

56. obj_div.style.left = xleft + "px"; 

57. obj_div.style.top = (xtop + 20) + "px";    //20差不多是输入框的高度,请根据实际情况调整************************************************************8 

58. li_down=-1; 

59.} 

60.////////////////////////隐藏提示层//////////////////////// 

61.function hideajaxdiv(){ 

62. obj_div.style.display="none"; 

63. li_down=-1; 

64.} 

65.////////////////////////设置被选

  • css样式//////////////////////// 

    66.function setlistyle(){ 

    67. for(var i=0;i

    68.  obj_div.firstChild.childNodes[i].id=""; 

    69. } 

    70. if(li_num!

    =-1)obj_div.firstChild.childNodes[li_num].id="liseleted"; 

    71.} 

    72.////////////////////////鼠标经过提示层//////////////////////// 

    73.function overli(Fun_seletedlinum){ 

    74. if(li_num==-1)value_ing=obj_input.value; 

    75. li_num=Fun_seletedlinum; 

    76. setlistyle(); 

    77.} 

    78.////////////////////////鼠标拖动提示层//////////////////////// 

    79.function moveli(){ 

    80. if(window.getSelection){ 

    81.  setfocus(); 

    82.  window.getSelection().removeAllRanges(); 

    83. }else{ 

    84.  document.selection.empty(); 

    85.  setfocus(); 

    86. } 

    87.} 

    88.////////////////////////鼠标按下提示层//////////////////////// 

    89.function downli(Fun_seletedlinum){ 

    90. if(!

    obj_input)return false; 

    91. li_down=Fun_seletedlinum; 

    92. input_focus=true; 

    93.} 

    94.////////////////////////鼠标弹起提示层//////////////////////// 

    95.function upli(Fun_seletedlinum,Fun_event){ 

    96. if(!

    obj_input)return false; 

    97. if(Fun_event.button==2){li_down=-1;return} 

    98. if(li_down!

    =Fun_seletedlinum){ 

    99.  li_down=-1; 

    100.  return false; 

    101. } 

    102. clearTimeout(ajax_delay); 

    103. clearTimeout(updown_delay); 

    104. updown_run=true; 

    105. ajax_run=false; 

    106. ajax_run_ing=false; 

    107. li_num=-1; 

    108. div_word=null; 

    109. 

    110. value_ed=obj_div.firstChild.childNodes[Fun_seletedlinum].childNodes[1].nodeValue; 

    111. obj_input.value=value_ed; 

    112. value_ing=value_ed; 

    113. hideajaxdiv(); 

    114. obj_div.innerHTML=""; 

    115.} 

    116.////////////////////////设置文本框获取焦点/////////////////////// 

    117.function setfocus(){ 

    118. if(window.event){ 

    119.  var r = obj_input.createTextRange(); 

    120.  r.moveStart('character',obj_input.value.length); 

    121.  r.collapse(true); 

    122.  r.select(); 

    123. }else{ 

    124.  obj_input.selectionStart=obj_input.value.length; 

    125.  obj_input.focus(); 

    126. } 

    127.} 

    128.////////////////////////文本框失去焦点//////////////////////// 

    129.function blurdeal(){ 

    130. if(input_focus==true){ 

    131.  setfocus(); 

    132.  setTimeout("setfocus()"); 

    133.  return false; 

    134. } 

    135. updown_run=false; 

    136. ajax_run=false; 

    137. ajax_run_ing=false; 

    138. clearInterval(main_delay); 

    139. clearTimeout(ajax_delay); 

    140. clearTimeout(updown_delay); 

    141. hideajaxdiv(); 

    142. if(value_ed!

    =obj_input.value)obj_div.innerHTML=""; 

    143.} 

    144.////////////////////////文本框获取焦点//////////////////////// 

    145.function focusdeal(Fun_event){ 

    146. if(!

    obj_div)createajaxdiv(); 

    147. if(input_focus==true){ 

    148.  input_focus=false; 

    149.  return false; 

    150. } 

    151. var obj=((window.event)?

    Fun_event.srcElement:

    Fun_event.target); 

    152. if(obj.type!

    ="text")return false; 

    153. updown_run=true; 

    154. ajax_run=true; 

    155. ajax_run_ing=false; 

    156. if(obj_input==obj && value_ed==obj.value && obj_div.innerHTML!

    =""){ 

    157.  obj_div.style.display="block"; 

    158.  removediv(); 

    159. }else{ 

    160.  obj_input=obj; 

    161.  value_ed=obj.value; 

    162.  value_ing=obj.value; 

    163.  value_unexit=""; 

    164.  li_num=-1; 

    165.  li_down=-1; 

    166.  div_word=null; 

    167.  obj_div.innerHTML=""; 

    168.  removediv(); 

    169. } 

    170. main_delay=setInterval("mainajax()",10); 

    171.} 

    172.////////////////////////主函数//////////////////////// 

    173.function mainajax(){ 

    174. if(value_ed==obj_input.value)return false; 

    175. if(value_unexit!

    ="" && (obj_input.value).indexOf(value_unexit)==0){hideajaxdiv();obj_div.innerHTML="";return false;} 

    176. if(value_ed!

    =obj_input.value && ajax_run_ing==false){ 

    177.  ajax_run=true; 

    178.  value_ed=obj_input.value; 

    179.  clearTimeout(ajax_delay); 

    180.  if(obj_input.value!

    =""){ 

    181.   ajax_delay=setTimeout("getsearch();",time_delayajax); 

    182.  }else{ 

    183.   hideajaxdiv(); 

    184.   obj_div.innerHTML=""; 

    185.   ajax_run=false; 

    186.   return false; 

    187.    

    188.  }   

    189. } 

    190.} 

    191.////////////////////////获取搜索内容//////////////////////// 

    192.function getsearch(){ 

    193. var temp_value=obj_input.value; 

    194. if(ajax_xmlhttp==null){ 

    195.  return false; 

    196. }else if(ajax_xmlhttp.readyState!

    =0){ 

    197.  ajax_xmlhttp.abort(); 

    198.  ajax_run_ing=false; 

    199. } 

    200. ajax_xmlhttp.onreadystatechange=function(){ 

    201.  if(ajax_run==false){ajax_xmlhttp.abort();ajax_run_ing=false;return false;} 

    202.  if(ajax_xmlhttp.readyState==4){ 

    203.   obj_div.innerHTML=""; 

    204.   if(ajax_xmlhttp.status==200 || ajax_xmlhttp.status==304){ 

    205.    var contant=ajax_xmlhttp.responseText; 

    206.    if(contant!

    ="" && ajax_run==true){ 

    207.     div_word=temp_value; 

    208.     obj_div.innerHTML=resetcontant(contant); 

    209.     obj_div.style.display="block"; 

    210.     removediv();removediv(); 

    211.    }else{ 

    212.     hideajaxdiv(); 

    213.    } 

    214.    updown_run=true; 

    215.    ajax_run_ing=false; 

    216.    li_num=-1; 

    217.    if(contant=="")value_unexit=temp_value; 

    218.   } 

    219.  } 

    220. } 

    221. ajax_xmlhttp.open("post",url,true); 

    222. ajax_xmlhttp.setRequestHeader('Content-type','application/x-www-form-urlencoded'); 

    223. ajax_run_ing=true; 

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

    225.} 

    226.////////////////////////内容重组/////////////////////// 

    227.function resetcontant(Fun_contant){ 

    228. if(Fun_contant==null || Fun_contant=="")return ""; 

    229. var a=Fun_contant.substring(1,Fun_contant.length-1); 

    230. if(Fun_contant==null || Fun_contant=="")return ""; 

    231. var b=a.split("''"); 

    232. va

  • 配套讲稿:

    如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。

    特殊限制:

    部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。

    关 键  词:
    google 自动 提示
    提示  冰豆网所有资源均是用户自行上传分享,仅供网友学习交流,未经上传用户书面授权,请勿作他用。
    关于本文
    本文标题:仿google自动提示.docx
    链接地址:https://www.bdocx.com/doc/7590701.html
    关于我们 - 网站声明 - 网站地图 - 资源地图 - 友情链接 - 网站客服 - 联系我们

    copyright@ 2008-2022 冰点文档网站版权所有

    经营许可证编号:鄂ICP备2022015515号-1

    收起
    展开