jQuery Isotope - 使用 AND 过滤（排除）答案

【问题标题】：jQuery Isotope - Filtering with AND (exclusion)jQuery Isotope - 使用 AND 过滤（排除）
【发布时间】：2012-03-02 09:14:18
【问题描述】：

我正在使用伟大的同位素并且一切正常，但现在我将执行以下操作：

我们有十个数据过滤器，例如 Filter1、Filter2、Filter3 等。一个项目包含例如过滤器 1 和过滤器 2。如果我选择 Filter1，就会出现这个项目 - 这没关系。如果我选择 Filter2（Filter1 仍然处于活动状态），该项目仍然存在 - 这也可以。现在我选择 Filter3（Filter1 和 Filter2 仍然处于活动状态）并且该项目应该被删除。这个案子没用。

如果我激活 Filter3，我会得到所有包含 Filter1 OR Filter2 OR Filter3 的项目。但我只想要包含 Filter1 AND Filter2 AND Filter3 的项目。应删除所有缺少过滤器（Filter1 或 Filter2 或 Filter3）的项目。

这样做的最佳做法是什么？

代码：

<ul class="project-tags">
    <li><a class="all selected" data-filter="all">All</a></li>
    <li><a class="" title="Filter1" data-filter=".Filter1">Filter1</a></li>
    <li><a class="" title="Filter2" data-filter=".Filter2">Filter2</a></li>
    <li><a class="" title="Filter3" data-filter=".Filter3">Filter3</a></li>
    <li><a class="" title="Filter4" data-filter=".Filter4">Filter4</a></li>
</ul>


var $iso = $('#projects');

$iso.isotope({ 动画引擎：''， itemSelector: '.color-shape', 石工： { 列宽：257，柱高：147 } });

$.filterIsotope = function(filter)
{
    $iso.isotope({ filter:filter });
}

$('.sidebar a').click(function(event){
    //$("body,html").animate({scrollTop:125});
   // event.preventDefault();
    var cat = $(this).attr('data-filter'),
        $links = $('#work-grid2 .sidebar a:not(.all)'),
        filter = "";
    if (cat == 'all')
    {
        $links.removeClass('selected');
    }
    else
    {
        $('.sidebar a.all').removeClass('selected');
    }
    $(this).toggleClass('selected');
    $links.each(function(index){
        if ($(this).hasClass('selected'))
        {
            if (filter.length) filter += ", ";
            filter += $(this).attr('data-filter');
        }
    });
    if (filter == "") $('.sidebar a.all').addClass('selected');
    $.filterIsotope(filter);
})

【问题讨论】：

标签： jquery

【解决方案1】：

我知道这有点晚了（也许几个月；）），但对其他人来说：

由于isotope filters 只是普通的 jQuery 选择器，要过滤具有 3 个类（即 AND）的元素，您需要这样的东西：

filter: '.Filter1.Filter2.Filter3'

在你的代码中，据我所知（元素会很好），这意味着删除这一行

if (filter.length) filter += ", ";

【讨论】：