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


Posted in Javascript onJanuary 09, 2007

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%左右的速度。

Javascript 相关文章推荐
javascript parseInt 函数分析(转)
Mar 21 Javascript
js实现同一页面多个运动效果的方法
Apr 10 Javascript
jQuery插件支持同一页面被多次调用
Feb 14 Javascript
JS简单循环遍历json数组的方法
Apr 22 Javascript
Javascript 制作图形验证码实例详解
Dec 22 Javascript
javascript设计模式之策略模式学习笔记
Feb 15 Javascript
利用ES6语法重构React组件详解
Mar 02 Javascript
bootstrap suggest搜索建议插件使用详解
Mar 25 Javascript
Angular2入门--架构总览
Mar 29 Javascript
修改UA在PC中访问只能在微信中打开的链接方法
Nov 27 Javascript
seajs下require书写约定实例分析
May 16 Javascript
element-ui 实现响应式导航栏的示例代码
May 08 Javascript
根据分辩率调用不同的CSS.
Jan 08 #Javascript
如何用javascript判断录入的日期是否合法
Jan 08 #Javascript
[IE&FireFox兼容]JS对select操作
Jan 07 #Javascript
javascript中的对象和数组的应用技巧
Jan 07 #Javascript
JavaScript For Beginners(转载)
Jan 05 #Javascript
JavaScript的目的分析
Jan 05 #Javascript
关于JavaScript的gzip静态压缩方法
Jan 05 #Javascript
You might like
PHP中判断变量为空的几种方法分享
2013/08/26 PHP
php使用codebase生成随机数
2014/03/25 PHP
php中get_defined_constants函数用法实例分析
2015/05/12 PHP
PHP翻页跳转功能实现方法
2020/11/30 PHP
php设计模式之享元模式分析【星际争霸游戏案例】
2020/03/23 PHP
PHP开发API接口签名生成及验证操作示例
2020/05/27 PHP
Laravel如何实现适合Api的异常处理响应格式
2020/06/14 PHP
文本框的字数限制功能jquery插件
2009/11/24 Javascript
JavaScript 语言的递归编程
2010/05/18 Javascript
在js中判断checkboxlist(.net控件客户端id)是否有选中
2013/04/11 Javascript
JS定时器实例
2013/04/17 Javascript
jquery实现仿Flash的横向滑动菜单效果代码
2015/09/17 Javascript
js如何判断输入字符串长度
2015/12/16 Javascript
值得分享的bootstrap table实例
2016/09/22 Javascript
微信小程序 两种滑动方式(横向滑动,竖向滑动)详细及实例代码
2017/01/13 Javascript
利用JS实现简单的日期选择插件
2017/01/23 Javascript
jQuery弹出层插件popShow(改进版)用法示例
2017/01/23 Javascript
requirejs按需加载angularjs文件实例
2017/06/08 Javascript
vue2.x select2 指令封装详解
2017/10/12 Javascript
详解Puppeteer 入门教程
2018/05/09 Javascript
JS+css3实现幻灯片轮播图
2020/08/14 Javascript
原生js实现弹幕效果
2020/11/29 Javascript
[54:26]完美世界DOTA2联赛PWL S3 Forest vs Rebirth 第一场 12.10
2020/12/12 DOTA
python os.path模块常用方法实例详解
2018/09/16 Python
python ubplot使用方法解析
2020/01/10 Python
Lookfantastic法国官网:英国知名美妆购物网站
2017/10/28 全球购物
美赞臣新加坡官方旗舰店:Enfagrow新加坡
2019/05/15 全球购物
Myprotein亚太地区:欧洲第一在线运动营养品牌
2020/12/20 全球购物
电气技术员岗位职责
2013/11/19 职场文书
技术学校毕业生求职信分享
2013/12/02 职场文书
高中军训感言500字
2014/02/24 职场文书
庆七一宣传标语
2014/10/08 职场文书
2014年药店工作总结
2014/11/20 职场文书
毕业实习证明范本
2015/06/16 职场文书
SpringBoot系列之MongoDB Aggregations用法详解
2022/02/12 MongoDB
SQL Server使用T-SQL语句批处理
2022/05/20 SQL Server