`
dada_fangfang
  • 浏览: 144388 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

自己做的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代码好多了,简单实用。
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics