`
正斌charles
  • 浏览: 36923 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

【JS相关插件】自动完成提示插件(jquery.autocomplete)

阅读更多
jquery.autocomplete自动完成插件
$(document).ready(function() {
//在这里datafriends绑定JS的数据源
$("#txtUser").autocomplete(datafriends,
{
   max: 12,
   autoFill: false,
   mustMatch: false,
   matchContains: false,
   scrollHeight: 500,
   formatItem: function(data, i, total) {
   return data[0];
   }
   }).result(function(event,item){
     location.href="http://www.zhiliren.net/";
  });
  });

配置项介绍:
1. max //autoComplete下拉显示项目的个数.默认为10
2. autoFill //要不要在用户选择时自动将用户当前鼠标所在的值填入到文本框,默认为false
3. mustMatch //如果设置为true,autoComplete只会允许匹配的结果出现在输入框,所有当用户输入的是非法字符时将会得不到下拉框,默认为false
4. matchContains //决定比较时是否要在字符串内部查看匹配,如ba是否与foo bar中的ba匹配.使用缓存时比较重要.不要和autofill混用
5. scrollHeight //自动完成提示的卷轴高度用像素大小表示,默认为180
6. formatItem //对匹配的每一行数据使用此函数格式化,返回值是显示给用户的数据内容。参数data表示服务器返回来的结果的数组,i表示当前行数,total表示搜索到的对应个数(总记录数),如果不指定直接返回服务器的结果值
7. formatResult //此函数是用户选中后返回的数据格式,比如只返回row.name或row.id等,参数与formatItem相同
8. formatMatch //对每一行数据使用此函数格式化需要查询的数据格式,返回值是给内部搜索算法使用的。实例中用户看到的匹配结果是formatItem中设置的格式,参数与formatItem相同
9. result 此事件会在用户选中某一项后触发,参数为 event,data,formatted。event为事件对象,data为选中的数据行,formatted的官方解释的是formatResult函数的返回值,但是实验结果是formatMatch的返回值

匹配中文问题:
如果所下版本的autocomplete控件对中文搜索存在bug的话,请将keydown事件修改为keyup事件。​
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics