您还没有提供您尝试过的内容,因此根据您的要求假设并创建一个示例。我从here得到了很好的参考
所以我们开始:-
首先,您需要为要从中获取数据创建一个数据库。为此,您需要创建一个connection string。下面是我使用Northwind database的示例
<connectionStrings>
<addname="constr"connectionString="Data Source = .\SQLExpress;
Initial Catalog = Northwind; Integrated Security = true"/></connectionStrings>
其次,在这种情况下,我们还需要一个处理程序来处理您的自动完成请求
<%@ WebHandler Language="C#" Class="Search_CS" %>
using System;
using System.Web;
using System.Data.SqlClient;
using System.Configuration;
using System.Text;
public class Search_CS : IHttpHandler {
public void ProcessRequest (HttpContext context) {
string prefixText = context.Request.QueryString["q"];
using (SqlConnection conn = new SqlConnection())
{
conn.ConnectionString = ConfigurationManager
.ConnectionStrings["constr"].ConnectionString;
using (SqlCommand cmd = new SqlCommand())
{
cmd.CommandText = "select ContactName from Customers where " +
"ContactName like @SearchText + '%'";
cmd.Parameters.AddWithValue("@SearchText", prefixText);
cmd.Connection = conn;
StringBuilder sb = new StringBuilder();
conn.Open();
using (SqlDataReader sdr = cmd.ExecuteReader())
{
while (sdr.Read())
{
sb.Append(sdr["ContactName"])
.Append(Environment.NewLine);
}
}
conn.Close();
context.Response.Write(sb.ToString());
}
}
}
public bool IsReusable {
get {
return false;
}
}}
之后,您需要在您的 aspx 页面中调用 javascript 函数,以便您的 autocomplete 部分可以正常工作。
<link href="css/jquery.autocomplete.css" rel="stylesheet" type="text/css" />
<script src="scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="scripts/jquery.autocomplete.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#<%=txtSearch.ClientID%>").autocomplete('Search_CS.ashx');
});
</script>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="txtSearch" runat="server"></asp:TextBox>
</div>
</form>
这就是你需要实现的东西。
下面是它的样子,
另见相关插件文档。
https://api.jqueryui.com/autocomplete/
Jquery 自动完成类别。
https://jqueryui.com/autocomplete/#categories
如果您遇到这些问题,请告诉我们。我们很乐意为您提供帮助。