Web.config
<system.web>
<httpHandlers>
<add verb="POST,GET" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory, AjaxPro"/>
</httpHandlers>
1function GetIE(e)
2{
3 //获取对象的大小及位置
4 var t=e.offsetTop;
5 var l=e.offsetLeft;
6 var w=e.offsetWidth;
7 var h=e.offsetHeight;
8 while(e=e.offsetParent)
9 {
10 t+=e.offsetTop;
11 l+=e.offsetLeft;
12 }
13 var re = {Top:t,Left:l,Width:w,Height:h}
14 return re;
15}
16
17function DoSelect(id,text)
18{
19 //完成选择项
20 document.getElementById(id).value=text; //返回选项的值给文本框
21 DeleteTip("TipListBox"); //删除提示窗口
22}
23function SelectItem(Pos)
24{
25 //将焦点给指定位置的项
26 var e = document.getElementById("TipListBox_"+Pos);
27 if(e != null) e.focus();
28 event.returnValue = 0;
29}
30function SetFocusStyle(refObj)
31{
32 //设置光标所在项的样式
33 refObj.style.color="#fff";
34 refObj.style.backgroundColor="#0066CC";
35}
36function SetBlurStyle(refObj)
37{
38 //恢复光标所在项的样式
39 refObj.style.color="#000";
40 refObj.style.backgroundColor="";
41}
42function DeleteTip(id)
43{
44 //删除提示窗口
45 if(document.getElementById(id) != null)
46 {
47 document.getElementById(id).removeNode(true);
48 }
49}
50//取总数
51function CountNum(strValue,ID)
52{
53 var count=WebSite.MethodFunction.productcount(strValue,ID);
54 return count;
55}
56//取结果列项
57function GetstrHTML(strValue,ID)
58{
59 var strlist = WebSite.MethodFunction.bind(strValue,ID);
60 return strlist.value;
61}
62function ShowTip(refObj)
63{
64 DeleteTip("TipListBox"); //删除之前的提示窗口
65
66 document.onclick=function()
67 {
68 //如果鼠标操作不在当前文本框,则将提示窗口删除
69 if(event.srcElement.id != refObj.id)
70 {
71 DeleteTip("TipListBox");
72 document.onclick = null;
73 }
74 }
75 var currentPos = -1; //当前选项位置
76 var str = refObj.value; //当前文本框的值
77 var eMember = GetIE(refObj);
var eIframe=document.createElement("iframe");
eIframe.id="Tipiframe";
eIframe.style.cssText ="position:absolute;z-index:9;width:"+eMember.Width+"px;height:130px;top:"+(eMember.Top+eMember.Height)+"px;left:"+eMember.Left+"px;" ;
eIframe.frameborder="0";
78 var eWinElement = document.createElement("div");
79 eWinElement.id="TipListBox"; //指定提示窗口ID为TipListBox
80 eWinElement.style.cssText = "overflow:auto;background-Color:#fff;font-size:12px;border:1px solid #000;position:absolute;left:"+eMember.Left+"px;top:"+(eMember.Top+eMember.Height)+"px;width:"+eMember.Width+"px";
81 //var li = '<a href="javascript:void(0)" onblur="SetBlurStyle(this)" onfocus="SetFocusStyle(this)" id="TipListBox_$Order$" onclick="DoSelect("$ID$",this.innerText)" style="text-decoration:none;width:100%;cursor:default;color:#000;padding-left:2px;display:block;" onmouseout="SetBlurStyle(this)" onmouseover="SetFocusStyle(this)">$Value$</a>'; //列表项模板
82 var strHTML = "";
83 var iCount = 0;
84 strHTML = GetstrHTML(str,refObj.id);
85 iCount = CountNum(str,refObj.id);
86
87 if(strHTML == "") return; //如果没有配匹的值则不显示提示窗口
88 eWinElement.innerHTML =strHTML;
89 document.body.appendChild(eWinElement);
90 if(parseInt(eWinElement.offsetHeight)>120) eWinElement.style.height="120px"; //定义提示窗口高度
91 document.onkeydown=function()
92 {
93 if(event.keyCode == 40 && currentPos < (iCount-1))
94 {
95 //向下的按键操作
96 SelectItem(++currentPos);
97 }
98 if(event.keyCode == 38 && currentPos > 0)
99 {
100 //向上的按键操作
101 SelectItem(--currentPos);
102 }
103 if(event.keyCode != 38 && event.keyCode != 40)
104 {
105 //其它按钮将当前选项恢复-1的位置
106 currentPos = -1;
107 }
108 }
109}
110 //类
111 public class MethodFunction
112 {
113 [AjaxMethod]
114 public string bind(string strkey,string controlId)
115 {
116 string strConn="Data Source=BX-LWB;Initial Catalog=NorthWind;User ID=sa;Password=sa;";
117 string strList=string.Empty;
118 using (SqlConnection conn = new SqlConnection(strConn))
119 {
120 SqlCommand command = new SqlCommand("select ProductName from Products where ProductName like @Name", conn);
121 command.Parameters.Add(new SqlParameter("@name", strkey + "%"));
122 SqlDataAdapter adapter = new SqlDataAdapter(command);
123 DataSet ds = new DataSet();
124 adapter.Fill(ds);
125 System.Data.DataTable dt=ds.Tables[0];
126
127 for(int i=0;i<dt.Rows.Count;i++)
128 {
129 strList=strList+"<a href=\"javascript:void(0)\" onblur=\"SetBlurStyle(this)\" onfocus=\"SetFocusStyle(this)\" id=\"TipListBox_"+i.ToString()+"\" onclick=\"DoSelect('"+controlId+"',this.innerText)\" style=\"text-decoration:none;width:100%;cursor:default;color:#000;padding-left:2px;display:block;\" onmouseout=\"SetBlurStyle(this)\" onmouseover=\"SetFocusStyle(this)\">"+dt.Rows[i]["ProductName"].ToString()+"</a>";
130 }
131 return strList;
132 }
133 }
134 [AjaxMethod]
135 public int productcount(string strkey,string controlId)
136 {
137 string strConn="Data Source=BX-LWB;Initial Catalog=NorthWind;User ID=sa;Password=sa;";
138 string strList=string.Empty;
139 using (SqlConnection conn = new SqlConnection(strConn))
140
2{
3 //获取对象的大小及位置
4 var t=e.offsetTop;
5 var l=e.offsetLeft;
6 var w=e.offsetWidth;
7 var h=e.offsetHeight;
8 while(e=e.offsetParent)
9 {
10 t+=e.offsetTop;
11 l+=e.offsetLeft;
12 }
13 var re = {Top:t,Left:l,Width:w,Height:h}
14 return re;
15}
16
17function DoSelect(id,text)
18{
19 //完成选择项
20 document.getElementById(id).value=text; //返回选项的值给文本框
21 DeleteTip("TipListBox"); //删除提示窗口
22}
23function SelectItem(Pos)
24{
25 //将焦点给指定位置的项
26 var e = document.getElementById("TipListBox_"+Pos);
27 if(e != null) e.focus();
28 event.returnValue = 0;
29}
30function SetFocusStyle(refObj)
31{
32 //设置光标所在项的样式
33 refObj.style.color="#fff";
34 refObj.style.backgroundColor="#0066CC";
35}
36function SetBlurStyle(refObj)
37{
38 //恢复光标所在项的样式
39 refObj.style.color="#000";
40 refObj.style.backgroundColor="";
41}
42function DeleteTip(id)
43{
44 //删除提示窗口
45 if(document.getElementById(id) != null)
46 {
47 document.getElementById(id).removeNode(true);
48 }
49}
50//取总数
51function CountNum(strValue,ID)
52{
53 var count=WebSite.MethodFunction.productcount(strValue,ID);
54 return count;
55}
56//取结果列项
57function GetstrHTML(strValue,ID)
58{
59 var strlist = WebSite.MethodFunction.bind(strValue,ID);
60 return strlist.value;
61}
62function ShowTip(refObj)
63{
64 DeleteTip("TipListBox"); //删除之前的提示窗口
65
66 document.onclick=function()
67 {
68 //如果鼠标操作不在当前文本框,则将提示窗口删除
69 if(event.srcElement.id != refObj.id)
70 {
71 DeleteTip("TipListBox");
72 document.onclick = null;
73 }
74 }
75 var currentPos = -1; //当前选项位置
76 var str = refObj.value; //当前文本框的值
77 var eMember = GetIE(refObj);
var eIframe=document.createElement("iframe");
eIframe.id="Tipiframe";
eIframe.style.cssText ="position:absolute;z-index:9;width:"+eMember.Width+"px;height:130px;top:"+(eMember.Top+eMember.Height)+"px;left:"+eMember.Left+"px;" ;
eIframe.frameborder="0";
78 var eWinElement = document.createElement("div");
79 eWinElement.id="TipListBox"; //指定提示窗口ID为TipListBox
80 eWinElement.style.cssText = "overflow:auto;background-Color:#fff;font-size:12px;border:1px solid #000;position:absolute;left:"+eMember.Left+"px;top:"+(eMember.Top+eMember.Height)+"px;width:"+eMember.Width+"px";
81 //var li = '<a href="javascript:void(0)" onblur="SetBlurStyle(this)" onfocus="SetFocusStyle(this)" id="TipListBox_$Order$" onclick="DoSelect("$ID$",this.innerText)" style="text-decoration:none;width:100%;cursor:default;color:#000;padding-left:2px;display:block;" onmouseout="SetBlurStyle(this)" onmouseover="SetFocusStyle(this)">$Value$</a>'; //列表项模板
82 var strHTML = "";
83 var iCount = 0;
84 strHTML = GetstrHTML(str,refObj.id);
85 iCount = CountNum(str,refObj.id);
86
87 if(strHTML == "") return; //如果没有配匹的值则不显示提示窗口
88 eWinElement.innerHTML =strHTML;
89 document.body.appendChild(eWinElement);
90 if(parseInt(eWinElement.offsetHeight)>120) eWinElement.style.height="120px"; //定义提示窗口高度
91 document.onkeydown=function()
92 {
93 if(event.keyCode == 40 && currentPos < (iCount-1))
94 {
95 //向下的按键操作
96 SelectItem(++currentPos);
97 }
98 if(event.keyCode == 38 && currentPos > 0)
99 {
100 //向上的按键操作
101 SelectItem(--currentPos);
102 }
103 if(event.keyCode != 38 && event.keyCode != 40)
104 {
105 //其它按钮将当前选项恢复-1的位置
106 currentPos = -1;
107 }
108 }
109}
110 //类
111 public class MethodFunction
112 {
113 [AjaxMethod]
114 public string bind(string strkey,string controlId)
115 {
116 string strConn="Data Source=BX-LWB;Initial Catalog=NorthWind;User ID=sa;Password=sa;";
117 string strList=string.Empty;
118 using (SqlConnection conn = new SqlConnection(strConn))
119 {
120 SqlCommand command = new SqlCommand("select ProductName from Products where ProductName like @Name", conn);
121 command.Parameters.Add(new SqlParameter("@name", strkey + "%"));
122 SqlDataAdapter adapter = new SqlDataAdapter(command);
123 DataSet ds = new DataSet();
124 adapter.Fill(ds);
125 System.Data.DataTable dt=ds.Tables[0];
126
127 for(int i=0;i<dt.Rows.Count;i++)
128 {
129 strList=strList+"<a href=\"javascript:void(0)\" onblur=\"SetBlurStyle(this)\" onfocus=\"SetFocusStyle(this)\" id=\"TipListBox_"+i.ToString()+"\" onclick=\"DoSelect('"+controlId+"',this.innerText)\" style=\"text-decoration:none;width:100%;cursor:default;color:#000;padding-left:2px;display:block;\" onmouseout=\"SetBlurStyle(this)\" onmouseover=\"SetFocusStyle(this)\">"+dt.Rows[i]["ProductName"].ToString()+"</a>";
130 }
131 return strList;
132 }
133 }
134 [AjaxMethod]
135 public int productcount(string strkey,string controlId)
136 {
137 string strConn="Data Source=BX-LWB;Initial Catalog=NorthWind;User ID=sa;Password=sa;";
138 string strList=string.Empty;
139 using (SqlConnection conn = new SqlConnection(strConn))
140