项目中要用到ajax的自动完成功能，又不想用ajax.net中的自动完成功能。干脆基于jquery自己做一个js来实现。做完后感觉还不错，就想把它直接做成jquery的插件算了，正在查怎么做jquery插件的时候，在jquery官网上发现原来已经有了自动完成插件 (︸_︸)，算了还是做出来吧。
做出来后感觉还不错，最起码比官方的要小一些，而且还没有官方的缺点（官方插件用鼠标选择后，再用键盘选择会有问题），还加上了自己需要的一些功能。
下面介绍一下自己的成果，就是两个文件，jquery.AutoComplete.js和AutoComplete.css。先说AutoComplete.css，里面就是三个样式。
.floor
{...}
{
visibility: hidden;
position: absolute;
background-color:white;
border: 1px solid;
overflow: auto;
}
.unselected
{...}
{
background-color: white;
}
.selected
{...}
{
background-color: dodgerblue;
color: white;
}
visibility: hidden;和position: absolute;这两个是不能改的，其他都可以自己来定义。
再说jquery.AutoComplete.js的用法，先要在页面里引用上面的css文件，jquery-latest.pack.js（jquery文件）和jquery.AutoComplete.js文件（都是废话），然后在页面里加上下面的代码。
<
script
language
="javascript"
type
="text/javascript"
>
...
$(function()...{
$("input").AutoComplete(request,options);
});
</
script
>说明一下参数
request: 必需，ajax请求的地址，只要能返回一个字符串就可以。
option: 可选，用这个形式“{seperator:"；",autoTab:true,parameterName:"key",kwlength:2}”
详细说明一下:
seperator ：表示分隔符，默认为逗号,上面表示用分号，就是说rquest要输出一个类似“a;b;c;d”的字符串。
autoTab ：表示是否按回车后自动跳转到下一个文本框,true为自动跳转。
parameterName: 回传时的参数名,如果request为data.asp，parameterName为key的话，ajax的请求为data.asp?key=***的形式，如果省略的话，就使用文本框的name属性；如果文本框name属性也没有的话，就使用文本框的id属性。（如果连id也没有的话，这个插件就不能用了）
kwlength ：关键字最小长度，默认值为3，表示文本框内文本的长度最小为3时，才做ajax请求。
下面给一个完整的例子
<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html
xmlns
="http://www.w3.org/1999/xhtml"
>
< head
>
< title
>
AutoComplete
</
title
>
< link
href
="AutoComplete.css"
type
="text/css"
rel
="stylesheet"
>
< script
language
="javascript"
type
="text/javascript"
src
="js/jquery-latest.js"
></
script
>
< script
language
="javascript"
type
="text/javascript"
src
="js/jquery.AutoComplete.js"
></
script
>
< script
language
="javascript"
type
="text/javascript"
>
...
$(function()...{
$("input").AutoComplete("data.asp",...{seperator:";",autoTab:true,parameterName:"key",kwlength:2});
});
</ script
>
</ head
>
< body
>
< input
type
="text"
id
="test"
/>
< input
type
="text"
id
="Text3"
/>
< table
>
< tr
>
< td
>
< input
id
="Text1"
type
="text"
name
="key"
/></
td
>
</ tr
>
< tr
>
< td
>
< input
id
="Text2"
type
="text"
name
="key"
/></
td
>
</ tr
>
</ table
>
</ body
>
</ html
>
Data.asp 代码：
< %
if len
(request.querystring(
"
key
"
))
>
0
then
datas = ""
for i =
0
to
10
datas = datas &
request.querystring(
"
key
"
)
&
i
&
"
;
"
next
response.write(datas)
end if
% >
Data.asp很简单，就是用传的参数值生成一个字符串，用分号分割；效果看下面的图
具体例子可以到 http://bbs.jquery.org.cn/viewthread.php?tid=192&extra=page%3D1下载，直接放到IIS的虚拟目录下，用IE6、IE7和FF下测试都没有问题。
、
实际使用中还是发现了一些问题，做了一些修改，样式表里.floor里面visibility: hidden;可以不用了，增加了一个.net服务器端的例子，下载地址在http://www1.51ok.com/down.do?7A5EFE8D0FD43CDF8FE1336336A5A569，可以直接下载了。
