0

这是我的代码，效果很好。在一个网站上找到它并稍作修改。

<script>
(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":"Filterfunktion"});
$(form).append(input).appendTo(header);
$(input)
.change( function () {
var filter = $(this).val();


if(filter) {
// this finds all links in a list that contain the input,
// and hide the ones not containing the input while showing the ones that do
$(list).find("a:not(:Contains(" + filter + "))").parent().fadeOut();
$(list).find("a:Contains(" + filter + ")").parent().fadeIn();
} else {
$(list).find("li").slideDown();
}
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('')

      });
 });

}(jQuery));
</script>

但是我无法开始工作的一件事是，当脚本带有空格并且我在没有空格的情况下键入 ist 时，脚本应该找到/匹配一个字符串。

例如：

我有 DCB 112。当我现在在我的输入字段中输入“DCB 112”时，它会正确过滤并显示给我。但是当我输入“DCB112”时，脚本无法匹配这个并且什么也没有显示。有没有可能的解决方案？

来自波兰的问候！

4

2 回答 2

1

好的，也许有点扭曲，但我要做的是获取列表的所有链接并遍历它们，删除其文本的每个空格，并检查您要查找的文本是否在其中。像这样的东西：

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

// I'm omitting loads of code...
var text;
var index;
$(list).find('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
    }else{
        // The substring is not contained -> hide parent
    }
});

希望它有所帮助并且有效，因为我没有测试它：/

编辑：

测试和工作:)

http://jsfiddle.net/QVkuP/

于 2012-08-10T12:26:56.507 回答
1

简单的方法：

filter.replace(/\s/g, '');

但是只有当你有一个空格时它才会很好用，比如“DCB 112”。

困难的方法：您需要首先遍历您的列表以删除不匹配的链接。小心从两个值中删除空格以进行比较。并展示好的一面。

$(list).find("a").each(function()
{
    if($(this).text().replace(/\s/g, '') == filter.replace(/\s/g, ''))
    {
        $(this).parent().fadeIn();
    }
    else
    {
        $(this).parent().fadeOut();
    }
}

希望它会有所帮助，它仍然看起来有点难看，但它应该这样做......

于 2012-08-10T12:36:14.910 回答