百度那样的搜索，你懂的

如题！我想做一个百度那样的搜索框，WEB的！一输入内容，就会进数据库中进行查询，搜索框下面就会显示查询出来的部分信息供你选择，选择一个内容，就会根据选择的内容查询出这个内容的其它相关的信息！我想这个应该得用异步请求来做，但是这个样式好像不太怎么会弄，而且这个搜索框好像也不是一般的文本框！大哥大姐们有例子的，有链接的发一下，灰常感谢。

18 个解决方案

#1

google -- autocomplete

#2

ajax Toolkit里面就有这么个东西。

#3

最近刚做。不过不能像百度那么强大。

用WEB SERVICE +AJAX 实现。

#4

你可以就用一般的问本框，然后下面跟一个层，在keyup的时候ajax提交数据到后台，后台获取相关数据，通过json返回到前台，然后对json进行处理，div的html++就可以了。动动脑筋，动动手。

#5

有木有例子呢？ AJAX都忘光了。一直在改BUG。

#6

这类例子我有，不过跟百度相比那我的就不是东西了！

#7

       Web Service Code：
           /// <summary>
    /// UserWebService 的摘要说明
    /// </summary>
    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    [System.ComponentModel.ToolboxItem(false)]
    // 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务，请取消对下行的注释。
      [System.Web.Script.Services.ScriptService]
    public class UserWebService : System.Web.Services.WebService
    {

        [WebMethod]

        public string[] GetHotSearchByKeyWordsUser(string prefixText, int count)
        {

            string connstr = @"Data Source=.;Initial Catalog=C:\HIGHNIGHT\WEB\APP_DATA\HIGHNIGHT.MDF;Integrated Security=True";
            SqlConnection conn = new SqlConnection(connstr);
            conn.Open();
            string sql = "select top " + count + "  UserName  from Users where UserName like '%" + prefixText + "%'";
            SqlDataAdapter sda = new SqlDataAdapter(sql, conn);
            DataSet ds = new DataSet();
            sda.Fill(ds);
            conn.Close();
            List<string> list = new List<string>();
            foreach (DataRow row in ds.Tables[0].Rows)
            {
                list.Add((string)row[0]);
            }
            return list.ToArray();

        }

    }

     页面：

           <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
            <div>输入用户名：
        <asp:TextBox ID="txtUserName" runat="server" BorderColor="#C8ECFF"
                BorderStyle="Solid" BorderWidth="2px" Width="157px"></asp:TextBox>
                <asp:ImageButton ID="ImageButton1" runat="server"
                    ImageUrl="~/Image/seach (2).bmp" ImageAlign="Bottom"
                    onclick="ImageButton1_Click" />
                </div>
           <cc1:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server"   TargetControlID="txtUserName"
                MinimumPrefixLength="1"
                 ServiceMethod="GetHotSearchByKeyWordsUser"
                 ServicePath="UserWebService.asmx"
                  EnableCaching="true"
                   CompletionSetCount="6" >
        </cc1:AutoCompleteExtender>

#8

Net+JQuery自动补全
http://hi.baidu.com/shenhui_1/blog/item/e78de51c2bd3c36edbb4bda6.html

#9

autocomplete

#10

#11

引用 7 楼 stylewang0529 的回复:

[b]
    C# code

       Web Service Code：
           /// <summary>
    /// UserWebService 的摘要说明
    /// </summary>
    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(Conform……

#12



<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>  

   

 <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>  

   

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">  

 <html xmlns="http://www.w3.org/1999/xhtml">  

 <head runat="server">  

     <title>AJAX控件之AutoComplete</title>  

 </head>  

 <body style="text-align: center">  

    <form id="form1" runat="server">  

         <asp:ScriptManager ID="ScriptManager1" runat="server" />  

         <div>  

             <asp:TextBox ID="MyAuto" runat="server" Width="191px"></asp:TextBox><br />  

             <br />  

             <cc1:AutoCompleteExtender ID="ace" runat="server" CompletionInterval="100" MinimumPrefixLength="1"  

                 ServiceMethod="GetCompletionList" ServicePath="WebService.asmx" TargetControlID="MyAuto">  

             </cc1:AutoCompleteExtender>  

             &nbsp;</div>  

     </form>  

</body>  

</html>

# using System;  

 using System.Web;  

 using System.Collections.Generic;  

 using System.Web.Services;  

 using System.Web.Services.Protocols;  

   

   

 /// <summary>  

 /// WebService 的摘要说明  

 /// </summary>  

 [WebService(Namespace = "http://tempuri.org/")]  

 [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]  

 //用以调用Web Service方法签名  

 [System.Web.Script.Services.ScriptService]  

 public class WebService : System.Web.Services.WebService {  

   

     public WebService () {}  

   

     [WebMethod]  

     public string[] GetCompletionList(string prefixText, int count)  

     {  

         //if (count == 0)  

         //{  

         //    count = 10;  

         //}  

         Random random = new Random();  

         List<string> items = new List<string>(count);  

         for (int i = 0; i < count; i++)  

         {  

             char c1 = (char)random.Next(65,90);  

             char c2 = (char)random.Next(97, 122);  

             char c3 = (char)random.Next(48, 57);  

             char c4 = (char)random.Next(33, 43);  

             items.Add(prefixText + c1 + c2 + c3 + c4);  

         }  

         return items.ToArray();  

     }  

   

}

#13

如果我用了WEBSERVICE的话，是不是也要把WEBSERVICE发布的？ WEBSERVICE发布是不是跟发布网站一样的？

#14

仿谷歌搜索

#15

http://i.laoer.com/jquery-autocomplete-plugin.html
最简单下拉提示框，字符串可用过数据库读取。
我有DEMO，要的说

#16

要考虑数据量大的时候应该怎么处理。。听说缓存技术使用上了。

#17

#18

对我有用，楼上的发个例子吧！

#1