自己做的jquery的autocomplete的一个例子

首先下载jquery.js和jquery.autocomplete.js
注意：jquery.js 要放在jquery.autocomplete.js前面。
还有个样式jquery.autocomplete.css , 随意下载。

首先js代码如下
$().ready(function() {
$("#searchText").autocomplete("$! {request.contextPath}/hrHiPersons!ajaxSelectPerson.action", {
minChars: 0,
max: 12,
autoFill: true,
mustMatch: true,
matchContains: false,
scrollHeight: 220,
formatItem: function(item) {
return item[0];
}
});
});
struts2的url应该不陌生吧
autocomplete的参数,这里不写了,可以参考
http://chenling1018.blog.163.com/blog/static/148025420101250354380/
他写的很详细,我也测过,基本都描述的差不多.

以前js方法的item参数,就是后台返回的json流,一下是java代码
public String ajaxSelectPerson(){
try {
String search = getRequest().getParameter("q");
if(search==null||search.length()==0) return null;
List<String> names = new ArrayList<String>();
names.add("张三");
names.add("李四");
names.add("王五");
getResponse().setCharacterEncoding("UTF-8");
JSONArray json = JSONArray.fromObject(names);
PrintWriter out = getResponse().getWriter();
out.print(json);
out.flush();
out.close();
return null;
} catch (Exception e) {
e.printStackTrace();
}
return null;
}
他默认是get提交,而且默认接受的参数是q,一般不用修改。
其次主要是乱码的问题,ajax的传输都是utf-8,所以我们尽量都转成utf-8(tomcat,jsp),然后把response也设置成utf-8,这样中文就没问题了。
还有个忘了说, 需要修改autocomplete的源码,主要是为了中文的输入识别问题
在199-200行
$(input.form).unbind(".autocomplete");

修改为：
$(input.form).unbind(".autocomplete").bind("input", function() {
onChange(0, true);
});

OK了,效果还是不错的,比原先手写的jquery代码好多了,简单实用。