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

2014-11-07  来源:本站原创  分类:javascript技巧  人气:1 

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

相关文章
  • JS控件autocomplete 0.11演示及下载 1月5日已更新 2014-11-07

    1月5日已更新 修复自动完成文本框焦点移失,自动完成容器不能消失的bug 增加expandAllItem方法,双击时可出现全部的item,详情请看示例 增加customStyle示例,该示例演示了如何对autocomplete控件进行css美化,见autocomplete_custom的css文件 演示及下载: http://www.never-online.net/code/neverModules/autocomplete/ 功能较上一版本的改进和功能: 1.匹配速度的提高. 2.加入ign

  • JS控件ASP.NET的treeview控件全选或者取消(示例代码) 2014-05-16

    本篇文章主要是对JS控件ASP.NET的treeview控件全选或者取消的示例代码进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助 <script language="javascript"> /* 函数名称:CheckNode(currentNode).ParentNode(currentNode).ChildNode(currentNode) 函数功能:实现带checkbox的treeview中 1.选中父结点其子结点也全部选中 2.取消全部子结点的选择后,父结

  • 自制的文件上传JS控件可支持IE.chrome.firefox etc 2015-03-09

    这篇文章主要介绍了自制的文件上传JS控件可支持IE.chrome.firefox etc,需要的朋友可以参考下 (function() { if (window.FileUpload) { return; } window.FileUpload = function (id, url) { this.id = id; this.autoUpload = true; this.url = url; this.maxSize = null; this.extensions = null; this.

  • JS控件的生命周期介绍 2014-05-04

    JS控件的生命周期跟其他平台UI的生命周期类似,但是又有自己的特点,我们只有将控件的生命周期划分清晰,所有的控件编写.mixins的编写和plugin的编写才能遵循控件的生命周期做统一的管理 JS控件的生命周期跟其他平台UI的生命周期类似,但是又有自己的特点,我们只有将控件的生命周期划分清晰,所有的控件编写.mixins的编写和plugin的编写才能遵循控件的生命周期做统一的管理.在这里我把JS的生命周期定义为4部分: 1.initializer: 初始化,做一些不牵扯DOM操作的初始化操作 2

  • activereports报表控件7.0免费下载使用教程功能介绍大全 2014-04-28

    ActiveReports For .NET 6.0是一款强大的.NET报表控件,可以同时用于Windows Forms 和Web Forms平台下,具有自定义.高性能.高质量.多语言支持功能,可以进行报表设计,打印,浏览,转换,集成了图表功能,可以使用常用的2D图表进行数据展示,支持自定义报表.报表数据可以导出为现在常用的多种文件格式:PDF .Excel.RTF.TIFF等.ActiveReports for.NET.全部由C#编写,完全的整合在Visual Studio .NET IDE里

  • JCalendar 日历控件 v1.0 beta[兼容IE&Firefox] 有文档和例子 2015-01-19

    先扯点题外话^_^ 从注册时间来看,我是个老经典人,但是从发帖数来看同时我又是个新经典人.说起来倒是很巧的一件事,我在经典和无忧上注册的时间居然是同一天!2005-8-16,我依稀记得的是,当时注册经典是要下载一个东西.之后就一直在无忧上游荡,偶尔冒起来问几个问题.两年时间,问过不少弱智问题,也解答过一些问题.偶也在无忧的陪伴下从一个小菜鸟变成了一个老菜鸟.近段时间看过的几篇好文章都是经典里出的.记得其中一篇就是子虚乌有大大的杰作.我开始关注经典... 最近发现无忧人气在下滑,不知道是我主观感觉

  • .NET加密和解密控件Xceed Encryption Library控件详细介绍使用方法及下载地址 2014-05-12

    原文来自龙博方案网http://www.fanganwang.com/product/1374转载请注明出处Xceed Encryption Library 是一款ActiveX数据加密控件,支持最新的工业标准加密算法,支持对称和非对称密码学,可以对缓存.字符串.二进制数据.流数据或者文件进行加密和解密,并且不依靠微软的CryptoAPI.该产品包含在 Xceed Ultimate Suite 套包中. 具体功能: 支持强大的秘钥加密和公钥加密 支持强大的AES 128-, 192-, 256-

  • C#/winForm界面控件包Xceed SmartUI for .NET下载及使用介绍 2014-05-13

    Xceed SmartUI for .NET是一款功能强大的用户界面控件,提供了10多种可视化控件,以及导航UI控件,菜单.工具条.状态条.TreeView,列表.Tab等,完全有C#编写,完全集成于.NET开发环境,可见可得的设计器,是开发用户界面程序的首选控件. 具体功能: 控件提供了10多种时髦的WinForm控件:丰富的menubars.工具条.treeview.explorer bars .Office任务面板,状态条.tabstrips.可选列表.复选框等用户界面元素 提供了XP以及

  • 可视化电子表格控件Aspose.Cell详细介绍及下载地址 2014-08-08

    Aspose.Cells包含有一个类库,支持所有Excel格式类型的操作.它是一个非图形表格管理库,可适用于任何类型的应用程序(ASP.NET Web应用程序或Windows桌面应用程序).此外,组件也可以用于如ASP,PHP和Python的一些其他的解决方案等 Aspose.Cells提供了灵活的组件,能够用.NET应用程序来创建和管理,在服务器上安装而不需要Microsoft Excel电子表格. 功能丰富的组件,提供的不仅仅是基本数据的输入和输出. 有了这些组件开发人员可以导入和导出每一个

  • 基于jQuery的日期选择控件 2014-07-09

    终于把jQuery拼写正确了哈,哈哈javascript也是区分大小写的,所以确实不能写错,今天我来和大家分享的是日期选择控件的实现,功能也许不够强大,但是能够满足需求. 但是也有些问题,第一画日历有点慢,第二兼容性不太好IE Only,第三它不是基于jQuery的哈哈. 那还是老规矩,做之前先看下效果 这下是更酷的Ext风格了. 从上图我们可以看出这个控件其实有两个视图一个日期月视图,还有一个是年月选择视图. 1:还是先从HTML入手 日期控件确定HTML其实还是比较简单,因为明摆着是列表的数

  • 使用shieldUI Chart控件在ASP.NET和MVC应用程序中创建一个销售仪表板 2014-11-04

    本文中,我们将处理一个常见的数据可视化任务,即创建一个销售仪表板(dashboard).在商业演示中经常会使用销售仪表板来展现某个商业流程或商业目标的关键绩效指标,而完成这样一个演示的关键不仅在于对数据进行良好的可视化展示,还要有赏心悦目的外观.为了完成这一任务,我会使用相关的图表组件,它提供了全部的所需功能.这个示例中将使用ShieldUI中的图表组件,这一系列产品可以从网站的免费下载. 完成后的展示请见下图: (点击图像放大) 本示例将使用ASP.NET与MVC两种方式讲解. 使用代码 AS

  • 分页控件 实战 Post篇 2012-03-09

    前言: 分页,大伙并不陌生 也许你正用着:DataGrid/GridView自带的分页 也许你正用着:网上流传较广的AspnetPager分页控件 也许你正用着:其它同事写的分页控件 又也许:你正是那个写分页控件的人,如果是,现在的你是否回头看过自己当初的源码?感觉? 附言: 昨夜,花了两个小时左右,把一个2007年那会写的分页控件,重新优化改造了一下: cs代码大小从原来的14K,缩减到4K. 原来的分页控件源码:点击下载 在看以下正文之前,还是希望能看一下原来的分页控件的源码,这样才能感叹下

  • 开源:实现一个Google Calendar 样式的日程管理控件XgCalendar 2013-01-10

    Update:更新时的一个错误,导致默认主题拖拽没有样子了..Fixed ,请2009-11-24 14:55之前下载的同学重新下载吧. UPDATE:更新DEMO中时区的问题和其他几个小问题,大家可以从SVN上获取最新的DEMO代码. 2009-11-30 UPDATE:更新了缓存处理边缘的问题 2009-12-03 UPDATE: 修改数据访问为Subsonic 事实上它比EF更简单,并且效率更高 修改js中的若干bug,主要是时间边缘处理的问题.修改title的提示等等 新增了zip下载最

  • asp.net 使用ObjectDataSource控件在ASP.NET中实现Ajax真分页 2014-03-23

    ASP.NET 3.5中新增加的ListView控件是一个用于页面数据绑定和界面布局的非常棒的控件,它在ASP.NET 2.0 GridView的基础上做了很多改进,用户在使用时可以控制的元素更多,开发时的灵活性更大了,个人觉得ListView在使用时比DataGrid和GirdView更加顺手. ListView控件本身并没有分页功能,不过借助于ASP.NET中新增加的DataPager控件,我们可以非常方便地对ListView中的数据设置分页,这几乎不需要开发人员写一行代码,将ListVie

  • ExtJS 配置和表格控件使用第1/2页 2014-04-02

    ExtJS时一套AJAX控件,本人认为它是目前我见过最好最美的JS控件库,所以非常有学习和使用价值,如果你还没有接触过ExtJS或者压根对其不感兴趣,那么没有必要看下去了 ExtJS是一套完整的RIA解决方案,也因为功能完整造成了ext-all.js有400多k,由于是基于JS和CSS的功能实现,对客户端机器性能也有一定的要求,即不支持IE6以下的版本.如果您的项目对网页响应时间有严格的限制,或者客户端操作系统过于陈旧,一定不要选择ExtJS. 本文主要是介绍ExtJS的下载和配置以及一些简单的

  • jquery蒙版控件实现代码 2014-05-22

    jquery蒙版控件实现代码,学习jquery的朋友可以参考下. 样式代码: #div_maskContainer { display: none; } /*蒙版样式*/ #div_Mask{ z-index:1000; filter:alpha(opacity=40); position: absolute; left:0px; top:0px; background-color: #D4D0C8; } /*显示信息样式*/ #div_loading{ width:300px;height:

  • 关于C#使用Shockwaveflash控件设计器不显示问题的解决方案 2012-04-30

    用vs2008C# + flash控件做个动画演示系统,设计器添加Shockwaveflash后,说什么就是不显示,后来参考了网上的原文 http://hi.baidu.com/lyybn/blog/item/5f720d0e786207ee36d12281.html 在设计器中做如下修改即可 ((System.ComponentModel.ISupportInitialize)(this.axShockwaveFlash2)).BeginInit(); this.tableLayoutPane

  • AspNetPager控件的最基本用法 2015-02-10

    AspNetPager控件是一个基于.net的第三方免费开源控件,具有开发高效.使用方便.功能完整等优点 它弥补了GridView内置分页以及PageDatasource类辅助分页的不足,将分页数据逻辑和页面UI分离开来,非常有利于SQL分页的实现.下面仅举一个最基本的用法,帮助初学者入门. 到AspNetPage官方网站相应页面下载控件:点击打开链接 下载后解压缩,里面有一个AspNetPager.dll文件,它就是我们要使用的控件.另外还有一个spNetPager.xml文件,它是对应的文档

  • AspNetPager控件的最基本用法示例介绍 2015-04-13

    AspNetPager控件弥补了GridView内置分页以及PageDatasource类辅助分页的不足,下面仅举一个最基本的用法,帮助初学者入门 AspNetPager控件是一个基于.net的第三方免费开源控件,具有开发高效.使用方便.功能完整等优点.它弥补了GridView内置分页以及PageDatasource类辅助分页的不足,将分页数据逻辑和页面UI分离开来,非常有利于SQL分页的实现.下面仅举一个最基本的用法,帮助初学者入门. 到AspNetPage官方网站相应页面下载控件:点击打开链

  • .net CHARTING图表控件下载地址 2014-10-12

    .net CHARTING是一款功能强大的图表控件,利用.NET framework和GDI+为工作于ASP.NET和Winform的C#和VB.NET开发人员提供可托管的图表解决方案,提供了多种2D和3D图表类型以及组合图.仪表,完全支持iPhone, iOS, Andoid, WP7 & Tablet ,兼容多种浏览器:Chrome, FireFox, Safari, Opera, Internet Explorer等,支持Silverlight. 具体功能: 提供了多种基本图表以及多种金融