Asp.net中创建类似Google自动感应的输入文本框实例

导读：
　　现在,随着时代的发展,基于互联网的软件系统已成为趋势,用户对B/S模式的系统的要求也逐渐提高,尤其体现在人机交互的用户体验上.本文讲解在ASP.NET技术下实现输入文本框自动感应的例子.大家都使用过Google搜索,当您搜索电子相关时,下面将自动感应出相关的结果,如电子地图/电子书等,如下图所示:
　　
　　
　　如果不知道什么是auto complete text box，你可以查看google suggest,或者在hotmail live中输入收件人的那个提示.今天看了一下RichXin的blog,仿照他做了一个类似于hotmail,或者yahoo的Auto complete 邮件地址的TextBox,其实很简单就是在TextBox的keydown的事件中，
　　用_div = document.createElement("DIV"),然这个_div放置在Textbox的正下方，这个_Div也就像是一个Panel来装载查询后的数据。
　　function showPanel() <---这个事件就是keydown事件{ xmlHttp=GetXmlHttpObject()if (xmlHttp==null){alert ("Browser does not support HTTP Request")return} var url="GetUserEmail.aspx"url=url+"?keyword="+ 那个TExtBox的TextxmlHttp.onreadystatechange=stateChanged xmlHttp.open("GET",url,true)xmlHttp.send(null)}
　　在我的UserEmail.aspx页面中
　　SQL Query
　　SELECT TOP 10 FirstName+' '+ LastName AS　FullName, PrimaryEmail from UserTable
　　WHERE FirstName = @Keyword OR LastName = @Keyword OR PrimaryEmail=@keyword
　　取到数值以后，把它放到javascript中的Array,然后在
　　string fullName ="";
　　string Email = "";
　　while(datareader.read())
　　{
　　fullName += "'" + dr["FullName"] + "',";
　　Email += "'" + dr["PrimaryEmail"] +"',";
　　}
　　然后Response.Write("callBack1(new Array(" + fullName +"), new Array(" + Email +"));");
　　这个也就是以后的xmlHttp.responseText
　　然后eval(xmlHttp.responseText)
　　在callBack1(a,b)这个function中，还记得我们的那个_div吗？
　　首先，我们要确保这个_div中没有任何的childElement,所以我们首先要清除所有的childElement因为我们默a,b这两个Array的数值应该是相对应的，所以我们for(var i=0; i
　　当点中一个行时，就把b[i]写进到TextBox中。
　　这就是总体的Auto Complete Box。

以上内容属网上转载,如有侵权,请来信告知,我们将立即删除。
本文转自
http://www.tianmomo.com/Development/Dot-Net/Google-Search-Auto-Complete-Box-Example.html