jQuery实现的快速查找

时间：2009年06月04日作者：愚人码头查看次数:4,843 views评论次数：0

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

如图：

jQuery代码：


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

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

声明: 本文采用 BY-NC-SA 协议进行授权 | WEB前端开发
转载请注明转自《jQuery实现的快速查找》

如果你读了我的文章，觉得有帮助：