javascript - 同位素搜索过滤器几乎弄清楚了

Question

最后一点需要一些帮助......

我有一把 fiddle here ...

我通过按钮单击过滤了搜索，并通过关键字进行搜索。他们独立工作，但我似乎无法让他们一起工作。

我认为该功能就在这里，但我有点迷失......

function isotopeSearch(kwd)
{
    // reset results arrays
    var matches = [];
    var misses = [];

    $('.item').removeClass('match miss'); // get rid of any existing classes
    $('#noMatches').hide(); // ensure this is always hidden when we start a new query

    if ( (kwd != '') && (kwd.length >= 2) ) { // min 2 chars to execute query:

        // loop through brands array        
        _.each(items, function(item){
            if ( item.first.indexOf(kwd) !== -1 ) { // keyword matches element
                matches.push( $('#'+item.id)[0] );
            } else {
                misses.push( $('#'+item.id)[0] );
            }
        });

        // add appropriate classes and call isotope.filter
        $(matches).addClass('match');
        $(misses).addClass('miss');
        $container.isotope({ filter: $(matches) }); // isotope.filter will take a jQuery object instead of a class first as an argument - sweet!

        if (matches.length == 0) {
            $('#noMatches').show(); // deal with empty results set
        }

    } else {
        // show all if keyword less than 2 chars
        $container.isotope({ filter: '.item' });
    }

}

编辑:我正在尝试使其只能按名字/姓氏进行搜索。

Answer 1

基本上看起来您的"*" 选择器导致了几个All 按钮出现问题。如果你只是将它们设为空白“”，它似乎可以工作。

我将此警报放入您的代码中，并注意到选择器在几次选择后变得有点奇怪:

    var selector = isoFilters.join('');
    alert(selector);

您最终会得到像 **.ar 这样的选择器

JSFiddle 在这里:http://jsfiddle.net/TrueBlueAussie/2pasq/14/

没有完整的项目值集来测试所有组合，但如果您删除两个“*”过滤器，它似乎可以工作。