1

我对从 Internet 获取并为我的目的修改它的 jquery 过滤器功能没有什么问题。

jsFiddle 示例

这是代码：

    (function ($) {
// custom css expression for a case-insensitive contains()
jQuery.expr[':'].Contains = function(a,i,m){
return (a.textContent || a.innerText || "").toUpperCase().indexOf(m[3].toUpperCase())>=0;
};


function listFilter(header, list) { // header is any element, list is an unordered list
// create and add the filter form to the header
var form = $("<form>").attr({"class":"filterform","action":"#"}),
input = $("<input>").attr({"class":"filterinput","type":"text", "value":"Live-Filterfunktion"});
$(form).append(input).appendTo(header);
$(input)
.change( function () {

var filter = $(this).val().replace(/\s+/g, '').toLowerCase();

$('.serien a').each(function(i, el){
    text = $(el).text().replace(/\s+/g, '').toLowerCase();
    index = text.indexOf(filter);
    if(index != -1){
        // The substring is contained -> show parent
        //console.log($(this).attr('id')+' contains '+filter);
        //$(this).find("a:Contains(" + filter + ")").parent().fadeIn();
        $(this).parent().show();

    }else{
        // The substring is not contained -> hide parent
        //console.log($(this).attr('id')+' does not contain '+filter);
        //$(this).find("a:not(:Contains(" + filter + "))").parent().fadeOut();
        $(this).parent().hide();
    }
});


return false;
})
.keyup( function () {
// fire the above change event after every letter
$(this).change();
});
}
//ondomready
$(function () {
listFilter($(".filter"), $(".list"));
});



$(function() {
    $(".filterinput").focus(function() {
      $(this).val('')
      $(this).change();

      });
 });

}(jQuery));

过滤器效果很好，我什至让它忽略了空格。但是我有一个问题我无法解决。仅当搜索关键字在一行中时，过滤器的匹配才有效。

jsFiddle 链接的示例

输入输入字段“John Wayne”甚至“johnwayne”，它工作正常！但是现在键入“John Tayler”，它不起作用，因为搜索关键字不是连续/连续，但列表包含两个关键字。我试了又试，但我无法让它工作。

所以我希望我能在这里得到一些帮助，那就太好了。对不起，我来自波兰的英语不好。

问候！

4

0 回答 0