简单的按钮同位素过滤示例好吗?

Simple button isotope filtering example please?

我一直在到处寻找我真正能理解的同位素示例,但我无法理解!

最好不用多维数组? :|

这是我目前拥有的 jsfiddle https://jsfiddle.net/LL39kwue/2/

var $grid = $('#grid').isotope({
  itemSelector: '.item',
  layoutMode: 'packery',
});
$(function() {
  var $buttons = $('#filter-menu button');
  $buttons.on('click', function() {
    var filterValue = $(this).attr('data-filter');
    $(this).addClass('active').siblings().removeClass('active');
    $grid.isotope({
      filter: filterValue
    });
  });
});

我只想一次 select 多个过滤器选项,例如。 .category-1, .category-2

我已经尝试将我的示例与此复选框示例结合使用 http://codepen.io/desandro/pen/qaEsi

$(function() {
  var $buttons = $('#filter-menu button');
  var filters = [];
  $buttons.on('click', function() {
    var filterValue = $(this).attr('data-filter');
    filters.push(filterValue);
    $(this).addClass('active');
  });
  filters = filters.join(', ');
  $grid.isotope({
    filter: filters
  });
});

但是那个 returns: Uncaught TypeError: filters.push 不是函数

我想通了!

我遇到的问题是使用过滤器 = filters.join(', ');

需要

something_else = filters.join(', ');
$grid.isotope({
  filter: something_else
});

我不确定你是如何从错误中找出来的:Uncaught TypeError: filters.push is not a function :|

在这里工作 jsfiddle https://jsfiddle.net/8mj4nftv/2/