jquery 查找类似autoComplete 实现模糊查询

来源：互联网发布：百度贴吧加载数据失败编辑：程序博客网时间：2024/05/22 14:16

以下内容是来自IT潮流网通过在文本框中输入查找文字，下面的左边选择框跟着动态变动，右边的文本狂则显示选中的信息，主要涉及到的方法有jquery的
filter ，toUpperCase，trim 。
filter 查找匹配字符 toUpperCase 转化为大写形式 trim 去除空格。结果见图
下面说下主要的思路：（keyup 监听键盘事件）
$().ready(function () {
      $("#searchLabel").keyup(
      function () {
         sl = $.trim($("#searchLabel").val());
         $("#lb div").hide();
         var $d = $("#lb div").filter(":contains('" + sl + "')");
         $d.show();
/* 以下是因为我的标签中有涉及到中文首个字母查找*/
         sl = sl.toUpperCase();
         $("#lb").find("div").each(function () {
            if (eval('/.*' + sl + '.*/').test($(this).attr("title"))) {
                  $(this).show();
            }
         });

      }
   )

eval('/.*' + sl + '.*/').test($(this).attr("title"))) 字符串匹配

双击事件：
  $("#labels").append("<div title='" + $(obj).attr("title") + "' onclick='RemoveLabel(this," + id + ")'>" + $(obj).text() + "</div>");
双击移除事件：
  $(obj).remove();
var ary = LabelNames.split(';');
var ary2 = LabelIds.split(',');
var nlname = "";
var nlid = "";
for (var i = 0; i < ary.length - 1; i++) {
      var str = ary[i];
      if (str != $(obj).text()) {
         nlname += str + ";";
      }
}
LabelNames = nlname;
for (var i = 0; i < ary2.length - 1; i++) {
      var str = ary2[i];
      if (str != id) {
         nlid += str + ",";
      }
}

双击事件和双击移除事件最主要的是要判断是否数据有重复，是否有移除掉相应的信息

1.jpg(22.74 KB, 下载次数: 0)

详见:http://www.itclw.net/thread-660-1-1.html