Question

这是我的代码非常好。在网站上找到它并进行了一些修改。

<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没有空格。

对于exmpale：

我有＆lt; li＆gt; DCB 112.当我现在在我的输入字段中键入“DCB 112”时，它会正确过滤并告诉我。但是当我键入“DCB112”时，脚本无法与此匹配，并且没有显示任何内容。有可能解决方案吗？

来自波兰的问候！

Answer 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/

Answer 2

简单方法：

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();
    }
}

希望它会有所帮助，它仍然看起来有点丑陋的编码，但它应该这样做......

Jquery：包含应该忽略的空格

2 个答案: