-
大小: 84KB文件类型: .rar金币: 2下载: 1 次发布日期: 2021-06-06
- 语言: JavaScript
- 标签: autocomplete jquery
资源简介
项目中有一个城市导航,导航上有一个城市搜索,即用户输入城市名、或拼音即可有匹配的提示,方便用户选择。于是乎下载了一个jquery.autocomplete-1.1.3,但引用到项目后,发现几个问题,并相应做了修改:
1.中文输入后,服务端不能正常获取ajax提交的数据(此处,当然可以用相应转码,本人试了n种方便仍改),细看代码发现, 是用
$.get(this.serviceUrl, me.options.params, function(txt) { me.processResponse(txt); }, 'text');
提交的, 于是改成了我熟悉的提交方式。
$.ajax({url:this.serviceUrl,data:"query="+me.options.params.query,timeout: 5000,success: function(o){me.processResponse(o);}});
问题立即解决。 猜想,是默认utf-8编码与我服务端过滤器中转码以及代码的转码发生了冲突。
2.当输入框值发生变化时,onchange事件不灵敏。 于是,添加了一个函数,输入值一但onchange就调用 。
onKeyProcessDefult: function(i) {
var me, fn, s, d;
me = this;
s = me.suggestions[i];
d = me.data[i];
if(this.currentValue!=s || undefined==d){d="";s="";}
this.selectedIndex=0; //输入时,一但有匹配的项,就默认选择第一项,这样,再按回车键,即可直接submit提交 jht添加 2011-07-20
$(".auto_selected_val").val(d);
}
3. 当输入正确值,而不去选择相应提示项时,按回车键,不能完成自动提交。另外就是,当输入正确值,而不去选择相应提示项进,点击后面的提交按钮,也不能完成提交。(赶集网的城市切换也有这个小瑕疵哦)。 于是修改为,一但输入后只有可匹配的项时,就默认选中第一项(代码如上)。 这样,再提交就不是问题了。
4.输入值,当没有相应匹配项时,没有任何提示,不友好,影响用户体验。
5.服务服端注意返回json格式参数格试哦{ query:'c',suggestions:['北京','保定','包头','本溪'],data:['hr','cu','cy','cz'] }
项目应用实例:http://www.juyuan.com/members/city
参考实案例:http://www.ganji.com/index.htm
代码片段和文件信息
属性 大小 日期 时间 名称
----------- --------- ---------- ----- ----
文件 13421 2011-07-20 17:15 jquery.autocomplete.js
文件 63196 2011-07-15 18:50 jquery-1.3.2.min.js
文件 3403 2011-07-12 16:23 autocomplete_bj.png
文件 74752 2011-07-20 17:07 autocomplete应用.doc
文件 25367 2011-07-20 17:25 search.jsp
文件 1717 2011-07-20 18:00 autocompleteCity.jsp
----------- --------- ---------- ----- ----
181856 6
----------- --------- ---------- ----- ----
文件 13421 2011-07-20 17:15 jquery.autocomplete.js
文件 63196 2011-07-15 18:50 jquery-1.3.2.min.js
文件 3403 2011-07-12 16:23 autocomplete_bj.png
文件 74752 2011-07-20 17:07 autocomplete应用.doc
文件 25367 2011-07-20 17:25 search.jsp
文件 1717 2011-07-20 18:00 autocompleteCity.jsp
----------- --------- ---------- ----- ----
181856 6
评论
共有 条评论