编程 Javascript

文本框输入时实现自动提示（像百度、google一样）

Posted in Javascript onApril 05, 2012

只要有三个文件：
一个js插件autocomplete.js和autocomplete.css两个文件，这是jquery官方网站提供的插件；
他们的下载地址：http://jqueryui.com/demos/autocomplete/

一个是一般处理程序；
一个是apsx页面，看下面的代码吧;
前台：

<script type="text/javascript"> 
$(document).ready(function() { 
ShowUserList($("#TextBox1"), "LoginTest.ashx"); 
//TextBox1为文本框的ID，loginTest.ashx为请求的一般处理程序。 
function ShowUserList(obj, url) { 
$.getJSON( 
url, 
function(msg) { 
var names = new Array(); 
msg = msg.Table; 
var names = new Array(); 
for (var i = 0; i < msg.length; i++) { 
names.push(msg[i].loginName); 
} 
obj.focus().autocomplete(names); 
} 
); 
} 
}); 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 
用户名：<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> 
<asp:Button ID="Button1" runat="server" Text="登录" /> 
</div> 
</form> 
</body>

后台是一般处理程序：

public class LoginTest : IHttpHandler 
{ 
string str; 
public void ProcessRequest(HttpContext context) 
{ 
getUserName(); 
context.Response.Write(str); 
} 
public bool IsReusable 
{ 
get 
{ 
return false; 
} 
} 
private void getUserName() 
{ 
DataSet ds = SqlHelper.BuildDataSet("select * from login", CommandType.Text); 
str = ConvertJson.ToJson(ds); 
} 
}

运行结果：
文本框输入时实现自动提示（像百度、google一样）

文本框输入时实现自动提示（像百度、google一样）

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

鼠标移动到一张图片时变为另一张图片

Dec 05 Javascript

javascript实现轮显新闻标题链接

Aug 13 Javascript

弹出层之1：JQuery.Boxy (一) 使用介绍

Oct 06 Javascript

jQuery动态地获取系统时间实现代码

May 24 Javascript

js生成随机数之random函数随机示例

Dec 20 Javascript

给js文件传参数(详解)

Jul 13 Javascript

JS实现一次性弹窗的方法【刷新后不弹出】

Dec 26 Javascript

vue+vue-validator 表单验证功能的实现代码

Nov 13 Javascript

JavaScript满天星导航栏实现方法

Mar 08 Javascript

理顺8个版本vue的区别(小结)

Sep 17 Javascript

el-form 多层级表单的实现示例

Sep 10 Javascript

vue 判断页面是首次进入还是再次刷新的实例

Nov 05 Javascript

Ajax搜索结果页面下方的分页按钮的生成

Apr 05 #Javascript

jQuery之$(document).ready()使用介绍

Apr 05 #Javascript

javascript淡入淡出效果的实现思路

Mar 31 #Javascript

提高javascript效率一次判断,而不要次次判断

Mar 30 #Javascript

一个关于javascript匿名函数的问题分析

Mar 30 #Javascript

JavaScript 基础篇（一）

Mar 30 #Javascript

js确定对象类型方法

Mar 30 #Javascript

文本框输入时 实现自动提示（像百度、google一样）

文本框输入时实现自动提示（像百度、google一样）