高仿google suggest ajax示范
日期：2014-05-16 浏览次数：20643 次
高仿google suggest ajax示例
前段时间想用google suggest在网上找了很多都不尽人意,于是自己花了些时间写了一个,跟google suggest 基本一样,后面的约多少结果非本程序范围哦
需要修改的地方有
javascript.js
var url="ajax.asp"; //后台地址
var time_delayajax=300; //搜索延迟
var time_delayupdown=100; //方向键延迟
obj_div.style.top = (xtop + 20) + "px"; //20差不多是输入框的高度,请根据实际情况调整
ajax_xmlhttp.send("sift_value="+escape(temp_value)); //提交到后台的值
dd=d+"<li onmouseover=\"overli("+i+");\" onmousedown=\"downli("+i+")\" onmouseup=\"upli("+i+",event)\" onmousemove=\"moveli();\"><span>约"+c[1]+"结果</span>"+c[0]+"</li>";//****li的显示
后台输出结果格式必需为'文本1,文本2'..... 'java,2''javascript,11''java示例,22'等
default.css
.ajaxsearch {
width:300px; //提示层的宽度
}
首页index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="default.css" />
<script language="JavaScript" src="javascript.js" type="text/javascript"></script>
<title>Google suggest高仿示例</title>
</head>
<body onResize="removediv();">
<div style="margin:20px 50px">
<input style="width:298px;height:18px" type="text" autocomplete="off" onBlur="blurdeal();" onKeyDown="keydowndeal(event);" onFocus="focusdeal(event);" />
</div>
</body>
</html>
脚本javascript.js
///////////////////////////////搜索提示框/////////////////////////////////
var obj_div; //提示层对象
var obj_input; //输入框对象
var main_delay; //判断值变化延迟对象
var ajax_delay; //ajax延迟搜索对象
var updown_delay; //方向键延迟对象
var ajax_xmlhttp; //ajax对象
var div_word=null; //当前提示层对应的搜索值
var li_num=-1; //伪光标位置,提示层被选中的li序号,从0开始
var li_down=-1; //鼠标按下提示层的序号
var value_ed=''; //输入框延迟前的值
var value_ing=''; //输入框当前的值
var value_unexit=''; //搜索过没有结果的值开头
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;}
}
}
////////////////////////创建提示层////////////////////////
function createajaxdiv(){
var create_div = document.createElement('div');
create_div.type = 'div';
var promptdiv = document.body.appendChild(create_div);
promptdiv.className = 'ajaxsearch';
obj_div=pr
前段时间想用google suggest在网上找了很多都不尽人意,于是自己花了些时间写了一个,跟google suggest 基本一样,后面的约多少结果非本程序范围哦
需要修改的地方有
javascript.js
var url="ajax.asp"; //后台地址
var time_delayajax=300; //搜索延迟
var time_delayupdown=100; //方向键延迟
obj_div.style.top = (xtop + 20) + "px"; //20差不多是输入框的高度,请根据实际情况调整
ajax_xmlhttp.send("sift_value="+escape(temp_value)); //提交到后台的值
dd=d+"<li onmouseover=\"overli("+i+");\" onmousedown=\"downli("+i+")\" onmouseup=\"upli("+i+",event)\" onmousemove=\"moveli();\"><span>约"+c[1]+"结果</span>"+c[0]+"</li>";//****li的显示
后台输出结果格式必需为'文本1,文本2'..... 'java,2''javascript,11''java示例,22'等
default.css
.ajaxsearch {
width:300px; //提示层的宽度
}
首页index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="default.css" />
<script language="JavaScript" src="javascript.js" type="text/javascript"></script>
<title>Google suggest高仿示例</title>
</head>
<body onResize="removediv();">
<div style="margin:20px 50px">
<input style="width:298px;height:18px" type="text" autocomplete="off" onBlur="blurdeal();" onKeyDown="keydowndeal(event);" onFocus="focusdeal(event);" />
</div>
</body>
</html>
脚本javascript.js
///////////////////////////////搜索提示框/////////////////////////////////
var obj_div; //提示层对象
var obj_input; //输入框对象
var main_delay; //判断值变化延迟对象
var ajax_delay; //ajax延迟搜索对象
var updown_delay; //方向键延迟对象
var ajax_xmlhttp; //ajax对象
var div_word=null; //当前提示层对应的搜索值
var li_num=-1; //伪光标位置,提示层被选中的li序号,从0开始
var li_down=-1; //鼠标按下提示层的序号
var value_ed=''; //输入框延迟前的值
var value_ing=''; //输入框当前的值
var value_unexit=''; //搜索过没有结果的值开头
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;}
}
}
////////////////////////创建提示层////////////////////////
function createajaxdiv(){
var create_div = document.createElement('div');
create_div.type = 'div';
var promptdiv = document.body.appendChild(create_div);
promptdiv.className = 'ajaxsearch';
obj_div=pr
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
