jQuery UI AutoComplete 自动完成使用小记

2022-01-15,,,,

jQuery UI AutoComplete 自动完成使用小记,使用jquery的朋友实现搜索自动完成等功能的朋友可以参考下。

页面:
复制代码 代码如下:

测试

后台:
复制代码 代码如下:

using System;
using System.Web;
public class GetAllWords : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
if (context.Request.QueryString["term"] != null && context.Request.QueryString["term"] != "")
{
context.Response.Clear();
context.Response.Charset = "utf-8";
context.Response.Buffer = true;
context.Response.ContentEncoding = System.Text.Encoding.UTF8;
context.Response.ContentType = "text/plain";
context.Response.Write(GetLikeUserName(context.Request.QueryString["term"]));
context.Response.Flush();
context.Response.Close();
context.Response.End();
}
}
///

/// 拼接json
///

/// 关键词
///
private String GetLikeUserName(string key)
{
jhg.BLL.web_wordManager wordManager = new jhg.BLL.web_wordManager();
//搜索,返回10个关键词
string[] listWord = wordManager.GetSearchWord(key, 10);
System.Text.StringBuilder sbstr = new System.Text.StringBuilder("[");
int ct = listWord.Length;
for (int i = 0; i <ct; i++)
{
sbstr.Append("\"" + listWord[i] + "\"");
if (i == ct - 1)
sbstr.Append("]");
else
sbstr.Append(",");
}
return sbstr.ToString();
}
public bool IsReusable
{
get
{
return false;
}
}
}

注:
文件:jquery.ui.autocomplete.css
.ui-autocomplete { position: absolute; cursor: default; }
去掉: position: absolute;
效果图:

以上就是jQuery UI AutoComplete 自动完成使用小记的详细内容,更多请关注本站其它相关文章!

《jQuery UI AutoComplete 自动完成使用小记.doc》

下载本文的Word格式文档,以方便收藏与打印。