javascript - javascript 如何按任意给定顺序过滤包含多个单词的字符串？

Question

我有一个简单的过滤器 alt <img> 中的属性。我把和 <INPUT> 。 当我搜索一个单词时一切正常，但当我输入另一个相同的单词时"alt"它没有显示任何内容。例子 alt = "pyramid green"

1. 如果我输入 GREEN，它会显示图片
2. 如果我输入 PYRAMID 它会显示图片

3. 如果我输入 PYRAMID GREEN 它会显示图片

   <强>4。如果我输入 GREEN PYRAMID 它不会显示任何内容

我想要的是搜索 alt 中的任何给定单词以任何给定顺序的属性。感谢您的帮助。

function search() {
var filter =  $('input').val().toUpperCase();
var li = $('li');
var a = $('a');
for (i = 0; i < li.length; i++) {
    a = li[i];
    if (a.innerHTML.toUpperCase().indexOf(filter) > -1 ) {    
        li[i].style.display = '';

    } else {
        li[i].style.display = 'none';

    }
}

}

Answer 1

您应该用空格分割过滤器字符串，因为现在您搜索整个字符串。

所以你的代码将是:

function search() {

    var filter =  $('input').val().toUpperCase().split(' ');
    var li = $('li');
    var a = $('a');
    for (var i = 0; i < li.length; i++) {
        a = li[i];
        var text = a.innerHTML.toUpperCase();
        for(var f = 0; f < filter.length; f++) {
            if (text.indexOf(filter[f]) > -1 ) {    
                li[i].style.display = '';
                break; // don't need further matches
            } else {
                li[i].style.display = 'none';
            }
        }
    }

}