软件开发培训班 >> 编程开发 >> JavaScript


JS控件autocomplete 0.11演示及下载 1月5日已更新

1月5日已更新

修复自动完成文本框焦点移失，自动完成容器不能消失的bug
增加expandAllItem方法，双击时可出现全部的item，详情请看示例
增加customStyle示例，该示例演示了如何对autocomplete控件进行css美化，见autocomplete_custom的css文件

演示及下载：
http://www.never-online.net/code/neverModules/autocomplete/

功能较上一版本的改进和功能：
1 。匹配速度的提高 。
2 。加入ignoreCase属性（为false时，将区分大小写，默认为true）
3 。加入ignoreWhere属性（为true时，匹配结果将使用贪婪匹配，即整个字符串中只要有输入的字符，将把dataSource内容送入匹配结果中）
4 。按esc返回 。
5 。兼容IE6.0, Opera9.0, Mozilla Firefox1.5
6 。可手动清空dataSource数据，或动态赋值给dataSource 。方便的进行AJAX，详细请看示例 。
7 。highlighted属性（默认为true，大数据量时，建议设置为false） 。
8 。在IE中，弥补div被select控件遮挡 。详细请看第一个示例 。
9 。方向键支持 。

思路以及参考：

初始化时，我把所有的数据都一次用join("")生成dataSource字符串（我在字符串字使用的html都尽量的简短，使之能够以最少的字符串生成数据），之后用正则来匹配 。感觉这已经在速度上是很快的了 。

虽然range功能还没有加进去，但基本的已经足够了 。速度还算理想 。现在发现一个速度问题就是，如果要在Opera，Mozilla，IE里充分利用其内核的效率，那么结果将是代码也许会大大的加长 。毕竟不同内核之间的效率是大不一样的 。

兼容性与效率同样也是一个矛盾的问题 。用insertAdjanceHTML这个方法，是在大数数量情况下，插入一个字符串的一个简单兼容方法之一 。

还有一个就是把highlight加入的问题，用了join之后，要加亮，必须再次回溯，从而相当于进行了两次匹配 。这个也是效率的问题之一 。所以建议大数据量情况下，把highlighted属性设为false 。这样效率理论上说，应该可以提高40%左右的速度 。