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

jquery自动完成

阅读更多
以下写得很零碎,纯粹是备忘
1,
  (1)如果用keydown,用中文输入法时在输入框里输汉语拼音的字母就会有感知,故只能用keyup
  (2)后退问题.
       如何区分是在中文输入法的输入框里的后退,还是自动完成录入框里的后退,二者的处理是不一样的。
  (3)确认键
       光标在form里时,按确认键浏览器会自动提交。而我想要的是一按确认键,自动录入选中的那一项。
如何在按确认键时不让form截获这个事件。要做成通用的,而不是在每一个form里写死。
   (4)调试时慎用alert
      alert然后确定时会自动执行blur,会影响的原来程序的执行次序
       

2,插件
 (1)http://code.google.com/p/jqac/ 不错
 (2)http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete 很好很强大
 (3)http://www.dyve.net/jquery/?autocomplete 有遮盖select box功能
 (4)http://docs.jquery.com/Plugins/AutoComplete
 (5)http://mabp.kiev.ua/content/2008/04/08/autocomplete_by_your_own_hands
 (6)http://www.pengoworks.com/workshop/jquery/autocomplete.htm
 (7)http://huacn.blogbus.com/logs/19643985.html

测试鼠标事件和键盘事件在IE和FF下的执行次序,同时测试在中文输入法下的执行次序
<!----><script>
function $(id){return document.getElementById(id);}
</script>
<input onmousedown="$('d').value=$('d').value+'down'" onmouseup="$('d').value=$('d').value+'up'"
 onclick
="$('d').value=$('d').value+'click'" ><br>
<input onkeydown="$('d').value=$('d').value+'down';" onkeyup="$('d').value=$('d').value+'up-'"
  onkeypress
="$('d').value=$('d').value+'press';"><br><br><br><br>
<input id='d' size=100>
你会发现,在非中文输入法模式下,IE和FF大体上按下面的顺序
(1)对key 来说 :keydown-->keypress-->keyup
如果持续按住键位,keydown会持续执行;
如果要阻止按键的默认行为,必须使用keypress(用return false),但按backspace时不行,因为backspace时只执行keydown和keyup,keyup之前回退的效果已经生效了。
(2)对mouse来说 :mousedown-->mouseup-->click ,在IE下如果在与按下鼠标的相同元素上松开则产生click事件,如果松开时已经离开最初按下时的元素了,则不会产生click事件;但据我观察FF下不是这样,FF下无论鼠标是否在最初的元素上松开,都会产生click事件。

在中文输入法模式下:
(1)FF
ff1.jpgff2.jpg
其中downup-up-是输入法切换时的键盘事件
输入第一个字母时产生down-press事件,然后输入任何字母都不会产生键盘事件, 只有按确认输入的键了,例如按space或是1,才会执行up事件,见右图。
也就是说录入一次中文时,不管中间过程怎么样,整个的键盘事件只有3个:down-press-up
(注:以上说的键盘事件都是指发生在input上的)
2,IE
IE1.jpgIE2.jpg
其中downup-up-也是输入法切换时的键盘事件
然后在输入法框里的所有按键都产生一对downup事件,包括回退和确认都是。
无论光标在input还是在输入法框按回退,都是down-up

用style.imeMode好像无法得到当前text的输入法模式
(http://topic.csdn.net/t/20040908/13/3351801.html)

http://www.hihiyou.com/?p=5
http://realazy.org/blog/2007/10/31/solution-of-keyup-failing-when-ime-is-on/
http://topic.csdn.net/t/20040714/21/3175529.html
http://www.iteye.com/topic/191555

onpropertychange时用event.propertyName   ==   "value"

分享到:
评论
1 楼 沉子风 2009-06-08  
谢谢分享,我目前用了第2个插件
感觉还不错。

相关推荐

    jquery自动完成输入框

    标题中的“jquery自动完成输入框”指的是使用jQuery库实现的Autocomplete功能,这是一种常见的前端UI交互设计,用于提升用户在输入框中输入信息时的效率和体验。它会在用户输入时提供匹配的建议列表,常见于搜索框、...

    jQuery自动完成插件autocomplete.zip

    jQuery自动完成插件是网页开发中常用的一种工具,它能够为用户提供实时的搜索建议,提升输入体验。在标题"jQuery自动完成插件autocomplete.zip"中,我们了解到这是一个基于jQuery库的插件,主要功能是实现自动完成...

    这是一款轻量级的jquery自动完成插件

    **jQuery自动完成插件概述** jQuery自动完成插件是一种便捷的前端开发工具,它极大地提升了用户体验,特别是当用户需要在输入框中输入特定数据时。这款轻量级的jQuery插件设计精巧,旨在帮助用户快速找到并选择匹配...

    jQuery自动完成插件jQuerycompleter.zip

    jQuery completer 是 jQuery 自动完成插件。在线演示 标签:jQuery

    仿百度搜索的jquery自动完成功能包

    【jQuery自动完成功能包详解】 在Web开发中,用户界面的交互性和便捷性是提升用户体验的关键因素之一。"仿百度搜索的jQuery自动完成功能包"正是为了解决这个问题而设计的,它允许开发者轻松地在网页文本框中实现...

    jquery自动完成插件

    **jQuery自动完成插件**是一种常用的前端开发工具,它能够为网页中的输入框提供自动补全功能,类似于搜索引擎的搜索建议。这种插件极大地提升了用户体验,减少了用户输入内容的时间,提高了交互效率。在网页设计中,...

    jquery自动完成插件收集集合

    **jQuery自动完成插件概述** 在网页开发中,jQuery自动完成插件是一种常见的交互功能,它为用户输入提供即时建议,提升用户体验。这些插件通常用于搜索框、表单输入等场景,帮助用户快速找到他们想要的信息或输入...

    jquery自动完成控件

    **jQuery 自动完成控件详解*...总的来说,jQuery自动完成控件通过其强大的功能和简洁的API,为Web开发者提供了高效构建搜索框和表单字段自动完成功能的途径。合理利用这个工具,可以显著提升网页的交互性和用户满意度。

    jquery 自动完成

    **jQuery 自动完成** jQuery 自动完成是一种交互式功能,用于在用户输入时提供下拉建议,常见于搜索框、...无论你是新手还是经验丰富的开发者,理解并掌握jQuery自动完成的原理和实践,都将对你的项目带来显著的提升。

    jquery 自动完成输入插件

    《jQuery自动完成输入插件——实现高效用户交互体验》 在网页开发中,提供便捷的用户输入体验至关重要,其中一种常见的方法就是使用自动完成输入功能。jQuery作为一个轻量级、功能丰富的JavaScript库,为开发者提供...

    php jquery 自动完成

    2. `autocomplete.js`:这是JavaScript文件,很可能包含了jQuery自动完成功能的主要逻辑,包括监听用户输入、发送AJAX请求、处理响应并更新界面等操作。开发者可以通过查看和修改这个文件来调整自动完成的行为。 3. ...

    sublime text2 jQuery自动完成插件

    在这个场景中,我们将聚焦于一个特定的插件——jQuery自动完成插件,它能极大地提升开发者的编码效率。 jQuery是一个广泛使用的JavaScript库,简化了HTML文档遍历、事件处理、动画和Ajax交互等任务。在Sublime Text...

    jquery自动完成下拉框源码示例

    这个“jquery自动完成下拉框源码示例”就是针对这一功能的实现。 jQuery 自动完成下拉框通常指的是一个输入框在用户输入时,会动态显示与输入内容匹配的建议列表。这种功能在搜索框、地址输入、产品选择等场景非常...

    JQUERY 自动完成autocomplete

    **jQuery 自动完成 Autocomplete 知识点详解** jQuery 的 Autocomplete 是一个强大的插件,它为用户在输入框中输入内容时提供实时的建议或匹配项,极大地提高了用户体验。这个功能广泛应用于搜索框、表单填充等场景...

    支持ajax的jquery自动完成插件

    **jQuery库与Ajax技术** ...综上所述,这款支持Ajax的jQuery自动完成插件提供了高效、灵活的自动补全功能,结合jQuery库的强大功能和JSON数据的便捷性,能够轻松地集成到各种Web应用中,提升用户交互体验。

    jQuery plugin for autocomplete - jQuery自动完成插件

    jQuery plugin for autocomplete - jQuery自动完成插件

    jquery 自动完成 Autocomplete

    **jQuery自动完成(Autocomplete)** jQuery的自动完成插件是一种强大的交互功能,它允许用户在输入文本时根据已有的数据集快速选择合适的选项。这个功能常见于搜索框、表单填充等场景,极大地提高了用户体验。在本篇...

    jQuery自动完成插件autocompleter

    **jQuery自动完成插件autocompleter** jQuery的自动完成插件,如"autocompleter",是一种增强用户输入体验的工具。它允许用户在输入框中输入文本时,根据预设的数据集提供实时的建议选项。这种功能在搜索框、地址栏...

    autocomplete, jQuery自动完成插件,如Google自动完成.zip

    autocomplete, jQuery自动完成插件,如Google自动完成 电子邮件自动完成文档&演示插件jQuery自动完成插件如谷歌搜索 npm install jquery-autocomplete

Global site tag (gtag.js) - Google Analytics