摘自:http://hi.baidu.com/jjflash/blog/item/31e36064a079bff6f7365428.html
jquery-autocomplete的类google
自动补全效果做得非常出色,不仅完成了应有的效果,而且还提供很多可以让用户自行扩展的地方.不过它对于输入法在firefox浏览器中的使用时不太理
想,原因在于基于firefox浏览器,用户的输入效果与ie的不同,javascript在此时没法监听到用户的键盘事件.
网上虽然有然关于这个问题的解决方法,比如:将源码:
<code>
$input.bind(($.browser.opera ? "keypress" : "keyup
"
</code>
红色部份为修改的,但这个方法只能解决部份输入法,如搜狗拼音输入法,而对于五笔输入法存在着问题.而且使得选中提示列表中某项后的回车事件出现严重问题,即直接提交,所以关于这个修改是不可取的.
不过google在这方面是做到位了的,它没有相关问题,当时我猜想是不是google用了计时器在不断得监听值的改变,而不是像jquery-autocomplete那样监听键盘事件.后来网上一篇作者名为Realazy写的文章回答了我的问题,以粗体内容转自http://www.webjx.com/javascript/jsajax-348.html
.
在某些情况下,比如自动补全(auto complete)的输入框中,需要使用keyup事件来监听键盘的输入以迅速作出回应。
关键在于keyup, 如果世界是美好的,那么就不会有这篇blog. 可是……
世界是不美好的。我们活在中文世界,我们要用输入法。在输入法开启的情况下,您会碰到不美好的事情:keyup失效。对于您绑定到keyup的任何回调函
数,除非您把输入法切换回英文状态,否则它会无动于衷。如果能称之为bug,我会很高兴,因为bug会有修复的可能,如果是特征(feature),那
么,我只好叹息一下。
问题:
在开启输入法的情况下,三个浏览器的具体问题如下:
IE:触发keydown和keyup, 不触发keypress. 能够获得输入值。
Firefox:触发keydown和keypress, 不触发keyup. 输入值未能获得。在回车后会触发keyup, 可获得输入值。
Opera:keydown, keypress和keyup都不触发,输入值也未能获。
(如果您能帮我试用一下Safari,我会很高兴并谢谢您。这里有一个 测试页面 )
解决方案:
总结出以上问题,没有兴奋反而陷入绝望,因为没有google出解决方案(是的,对于拉丁语系的老外来说,不会存在输入法)。但是,wait, 谷歌搜索的自动补全不是工作得好好的吗?于是研究一下这个
http://www.google.cn/ac.js
。嘿嘿,虽然混淆得还可以,但还是可以发现蛛丝马脚的。它使用一个计时器,当输入框处于聚焦(focus)状态时,每10毫秒执行一次回调函数。
虽然挺耗资源(所以建议在输入框失焦(blur)时,一定要清除这个计时器),但也只能如此了。作前端开发的,不仅要与语言(JavaScript, CSS, HTML) 斗,还要与浏览器斗,其乐无穷也。
总结:在客户端javascript上装下计时器不会影响性能,所以我认为google这种做法是可行的.因这与部分用户友好界面相比,再值得不过了.
相关推荐
NULL 博文链接:https://changpanzzp.iteye.com/blog/2101180
1.该js支持jquery的自动补全功能 2.因为jquery-ui是jquery的插件,所以部分版本jquery可能不支持该插件,建议换成内附的jquery.js 3.如有疑惑,请阅读内附的说明文档
jquery-autocomplete 可用
jquery-autocomplete 自动完成插件
jquery-autocomplete 智能提示jquery-autocomplete 智能提示jquery-autocomplete 智能提示jquery-autocomplete 智能提示
运用jquery.autocomplete.js 和jquery.autocomplete.css实现文本框自动补全,直接下载可以看到运行效果,带注释
autoComplete 自动补全 支持中文补全 中间字查询
jquery.autocomplete.js 参数属性介绍 [removed][removed]
ibatis +spring+struts2+jquery.autocomplete实现产品自动补全功能(二) 附带源码
Jquery-autocomplete [ 自动完成 ] ,网页无刷新,与 google baidu 一样
jQuery UI Autocomplete是jQuery UI的自动完成组件,通过ajax请求的JSON数组、JSONP来获取数据,实现自动补全功能
利用jquery.autocomplete.js插件实现了文本框自动补全的功能, 附件包含两个实例代码,均以txt文档显示,都有前台和后台代码。一个是传一个参数,一个是传两个参数,后台以一般处理程序ashx文件编写。大家只需要修改...
jquery-autocomplete文档,对后台如何获取参数,后台JavaBean如何处理结果返回页面做了一定的注释.以及根据实践的总结
jquery自动补全插件(jquery autocomplete) 内包含使用说明,前台+后台
前端项目-jquery-autocomplete,jquery的一个非常轻量级的完成建议插件。
jquery的一个autocomplete插件 不是ui里的那个,简单实用。
输入框自动补全 + 记录搜索缓存 输入框自动补全功能并实现与PHP交互,点击选中行后记录当前数据到本地cookie,同时可以跳转页面。 功能点: 输入框输入数值之后自动取服务端数据。 当输入框为空的时候 显示 缓存...
前端项目-jquery.devbridge-autocomplete,键入文本字段时,自动完成功能提供建议。