基于jquery的autoComplete插件网上有很多,搞得都不知道用哪个好。
试了一下这个,还不错:http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/
第一步:了解相关依赖
* jQuery
* bgiframe plugin
* dimensions plugin, only offset method is used
第二步:提供数据
这个插件的接口autoComplete可以接收一个数组或者一个远程URL作为参数以提供数据.
Array 用数组会比较直接,性能比较好,当然效果也会比较好
URL 一般是用ajax去取数据了,但是服务器端脚本要提供相应格式的数据.至于在SGL内如何应用的详细细节我会在下一篇中详细解释.
第三步:autoComplete接口相关配置选项的解释
简单的我就不介绍了,介绍一些常用的,其它的自己参考文档
* minChars (Number): 在触发autoComplete前用户至少需要输入的字符数.Default: 1
* delay (Number): 击键后激活autoComplete的延迟时间(单位毫秒).Default: 远程为400 本地10
* cacheLength (Number): 缓存的长度.即对从数据库中取到的结果集要缓存多少条记录.设成1为不缓存.Default: 10
* matchSubset (Boolean): autoComplete可不可以使用对服务器查询的缓存,作者举了个例子是如果缓存对foo的查询结果,那么如果用户输入foot就不需要再进行检索了,直接使用缓存,好处多多啊.通常是打开这个选项以减轻服务器的负担以提高性能.只会在缓存长度大于1时有效.Default: true
* matchCase (Boolean): 比较是否开启大小写敏感开关.使用缓存时比较重要.如果你理解上一个选项,这个也就不难理解,就好比foot要不要到FOO的缓存中去找.Default: false
* matchContains (Boolean): 决定是比较时是否要比较字符串内部查看匹配,如ba是否与foo bar中的ba匹配.使用缓存时比较重要.不要和autofill混用.Default: false
* mustMatch (Booolean): 如果设置为true,autoComplete只会允许匹配的结果出现在结果时,所有当用户输入的是非法字符时将会得不到下拉框.Default: false
* extraParams (Object): 为后台(一般是服务端的脚本)提供更多的参数.和通常的作法一样是使用一个键值对对象.如果传过去的值是{ bar:4 },将会被autocompleter解析成my_autocomplete_backend.php?q=foo&bar=4 (假设当前用户输入了foo). Default: {}
* selectFirst (Boolean): 如果设置成true,在用户键入tab或return键时autoComplete下拉列表的第一个值将被自动选择,尽管它没被手工选中(用键盘或鼠标).当然如果用户选中某个项目,那么就用用户选中的值. Default: true
* formatItem (Function): 首先要明白这个选项的值是一个函数的句柄或指针.函数的作用是为每个要显示的项目使用高级标签.即对结果中的每一行都会调用这个函数,返回值将用LI元素包含显示在下拉列表中. Autocompleter会提供三个参数: 返回的结果数组, 当前处理的行数(即第几个项目,是从1开始的自然数), 当前结果数组元素的个数即项目的个数. Default: none, 表示不指定自定义的处理函数,这样下拉列表中的每一行只包含一个值.
* formatResult (Function): 和formatItem类似,但可以将将要输入到input文本框内的值进行格式化.同样有三个参数,和formatItem一样.Default: none,表示要么是只有数据,要么是使用formatItem提供的值.
* multiple (Boolean): 是否允许输入多个值即多次使用autoComplete以输入多个值. Default: false
* multipleSeparator (String): 如果是多选时,用来分开各个选择的字符. Default: “,“
* width (Number): 指定下拉框的宽度. Default: input元素的宽度
* autoFill (Boolean): 要不要在用户选择时要不要自动将用户当前鼠标所在的值填入到input框.并在用户继续输入 Default: false
* max (Number): autoComplete下拉显示项目的个数.Default: 10
相关推荐
jquery-autocomplete搜索框自动完成的中文文档,上手快,轻便,功能强大
jquery autocomplete.js 是一款优秀的开源JS,支持自动完成,不过如果是中文失效。原因是由于中文编码不一致引起的,修改源文件中AJAX请求中的编码,加上escape编码后,在后台用Server.URLDecode解码后,则中文也...
jquery autocomplete 动态补全例子支持中文 ajax传递json数据 文件里有json数据拼接
PHP jquery autocomplete实现 解决中文乱码,上下键移动等功能
demo,可直接运行查看效果,实现的效果是:在输入框中输入汉字时触发keyup事件,即自动出现多个选项,选中某选项时自动将该选项值和所需属性填充到指定输入框中。
利用Jquery.AutoComplete插件及微软提供的ChineseConverter.dll实现汉字、拼音、简拼模糊搜索
jquery+json自动完成完整实例(修改版) 兼容各大浏览器,支持中文
用java实现autocomplete搜索功能,可以获取除输入框的其它动态参数,后台字符串拼接,返回json数据,格式如下: { query:'Li', suggestions:['Liberia', 'Libyan Arab Jamahiriya', 'Liechtenstein', 'Lithuania'...
javascript 实现Autocomplete 源代码。可以嵌入任何大多数ASP.net,java的系统中。携程网效果。但是Microsoft Dynamics CRM 4.0例外。 Microsoft Dynamics CRM 4.0用的以后推出。
NULL 博文链接:https://axl234.iteye.com/blog/1673411
jQuery UI Autocomplete 1.8.16 中文输入修正代码,使用jQuery UI Autocomplete的朋友可以参考下
主要介绍了jQuery autoComplete插件两种使用方式及动态改变参数值的方法,结合实例形式分析了jQuery自动匹配插件autoComplete的使用技巧与动态改变参数传入值的实现方法,需要的朋友可以参考下
二、修正了在firefox下中文输入,没有激活自动提交的问题。 老外当然不会用到中文输入,这个bug存在也理所当然了。 另:附件里的实现了选择后自动提交,也就和google、百度的效果完全一样了。 下载地址
jQuery.autocomplete 是jquery的流行插件,,能够很好的实现输入框的自动完成(autocomplete)、建议提示(input suggest)功能,支持ajax数据加载。
jQuery.Autocomplete 是jquery的流行插件,能够很好的实现输入框的自动完成(autocomplete)、建议提示(input suggest)功能,支持ajax数据加载。
jQM Autocomplete是一个自动提示相关内容的jQuery Mobile搜索插件。用户在搜索框输入前几个字母或是汉字的时候,Autocomplete就能从存放数据的文本或是数据库里将所有以这些字母开头的数据提示给用户,供用户选择,...
于是乎下载了一个jquery.autocomplete-1.1.3,但引用到项目后,发现几个问题,并相应做了修改: 1.中文输入后,服务端不能正常获取ajax提交的数据(此处,当然可以用相应转码,本人试了n种方便仍改),细看代码...
自动补全包含:邮箱自动补全、城市自动补全、中文自动补全功能
NULL 博文链接:https://ddl1st.iteye.com/blog/970487
jquery-easyui的combobox火狐下不支持中文匹配,修改了一下,增加了input事件监听,现已支持火狐下中文