🎶 Sym - 一款用 Java 实现的现代化社区(论坛/BBS/社交网络/博客)平台

📕 思源笔记 - 一款桌面端笔记应用,支持 Windows、Mac 和 Linux

🎸 Solo - B3log 分布式社区的博客端节点,欢迎加入下一代社区网络

♏ Vditor - 一款浏览器端的 Markdown 编辑器

jQuery 实现的快速查找

 

Posted on : 04-06-2009 | By : 愚人码头 | In : 前端框架

0

jQuery实现的快速查找就是一个列表中查找和你输入的文字相匹配的项,高亮并前置表示;

如图:

2009-06-04_002402

jQuery代码:

01.$(function(){
02.//键盘按键弹起时执行
03.$('#index').keyup(function(){
04.var index = $.trim($('#index').val().toString());//去掉两头空格
05.if(index == ''){
06.$('li').removeClass('on');return false;
07.}
08.var parent = $('ul');
09.$('li').removeClass('on');
10.//选择包含文本框值的所有加上focus类样式,并把它(们)移到ul的最前面
11.$("li:contains('" + index + "')").prependTo(parent).addClass('on');
12.});
13.});

完整 DEMO:http://www.css88.com/demo/jQuery/quickSearch/quickSearch.html

 


欢迎注册黑客派社区,开启你的博客之旅。让学习和分享成为一种习惯!

留下你的脚步