主题：筛选界面

下载信息  [文件大小：114.9 KB  下载次数：23]

点击浏览该文件:模糊搜索.zip

 

请把例子看懂，自行扩充。

 

下载信息  [文件大小：   下载次数： ]

点击浏览该文件:模糊搜索.rar

如果想扩展，参考下面插件

 

http://www.jq22.com/search?seo=%E6%A8%A1%E7%B3%8A%E6%90%9C%E7%B4%A2

 

6楼项目下载后测试，请认真测试。

web文件夹拷贝到自己的web文件夹里面去，看懂里面的css、js代码。

如果还有问题，请做一个别人可以打开测试的实例发上来。

修改js代码

 

(function ($) {
  jQuery.expr[':'].Contains = function(a,i,m){
      return (a.textContent || a.innerText || "").toUpperCase().indexOf(m[3].toUpperCase())>=0;
  };
  function filterList(header, list) {
  var form = $("<form>").attr({"class":"filterform","action":"#"}),
  input = $("<input>").attr({"class":"filterinput","type":"text", "id":"test"});
  $(form).append(input).appendTo(header);
  $(input)
      .change( function () {
        var filter = $(this).val();
        if(filter) {
    $matches = $(list).find('a:Contains(' + filter + ')').parent();
    $('li', list).not($matches).slideUp();
    $matches.slideDown();
        } else {
          $("#list").hide();
          //$(list).find("li").slideDown();
        }
        return false;
      })
    //.blur(function(){$("#list").hide();})
    //.focus(function() {$("#list").show();})
    .keyup( function () {
 $("#list").show();
        $(this).change();
    });
  }
  $(function () {
    filterList($("#form"), $("#list"));
  });
  $("#list").hide();
}(jQuery));