客户端代码： <!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=gb2312" /><title>使用JQuery和ASP打造AutoComplete功能</title><script type="text/javascript" src="js/jquery-1.2.1.pack.js"></script><script type="text/javascript"> function lookup(inputString) { if(inputString.length == 0) { // Hide the suggestion box. $('#suggestions').hide(); } else { $.post("showmember.asp", {queryString: ""+escape(inputString)+""}, function(data){ if(data.length >0) { $('#suggestions').show(); $('#autoSuggestionsList').html(unescape(data)); } }); } } // lookup function fill(thisValue) { $('#inputString').val(thisValue); setTimeout("$('#suggestions').hide();", 200); }</script> <style type="text/css"> body { font-family: Helvetica; font-size: 11px; color: #000; } h3 { margin: 0px; padding: 0px; } .suggestionsBox { position: relative; left: 30px; margin: 10px 0px 0px 0px; width: 200px; background-color: #212427; -moz-border-radius: 7px; -webkit-border-radius: 7px; border: 2px solid #000; color: #fff; } .suggestionList { margin: 0px; padding: 0px; } .suggestionList li { margin: 0px 0px 3px 0px; padding: 3px; cursor: pointer; } .suggestionList li:hover { background-color: #659CD8; }</style></head><body> <div> <form> <div> 请输入您的单位名称： <br /> <input type="text" size="30" value="" id="inputString" onkeyup="lookup(this.value);" onblur="fill();" /> </div> <div class="suggestionsBox" id="suggestions" style="display: none;"> <img src="images/upArrow.png" style="position: relative; top: -12px; left: 30px;" alt="upArrow" /> <div class="suggestionList" id="autoSuggestionsList"> </div> </div> </form> </div></body></html> 服务器端代码： <% 'unescape()函数 Function VBsUnEscape(str) dim i,s,c s="" For i=1 to Len(str) c=Mid(str,i,1) If Mid(str,i,2)="%u" and i<=Len(str)-5 Then If IsNumeric("&H" & Mid(str,i+2,4)) Then s = s & CHRW(CInt("&H" & Mid(str,i+2,4))) i = i+5 Else s = s & c End If ElseIf c="%" and i<=Len(str)-2 Then If IsNumeric("&H" & Mid(str,i+1,2)) Then s = s & CHRW(CInt("&H" & Mid(str,i+1,2))) i = i+2 Else s = s & c End If Else s = s & c End If Next VBsUnEscape = sEnd Function on error resume next response.Charset="GB2312" dim keyword keyword=Trim(request.Form("queryString")) set rs3=server.CreateObject("adodb.recordset") rs3.open "select UserName from [User] where Coname like '%"&VBsUnEscape(keyword)&"%'",conn,1,1 if rs3.eof and rs3.bof then response.Write("没有该会员！") else do while not rs3.eof%><li onclick="fill('<%=rs3("UserName")%>');"><%=rs3("UserName")%></li><% rs3.movenext loopend if rs3.close set rs3 = nothing %> 效果图：
评论