同位素切换组合过滤器

Question

我想让同位素组合过滤器切换，所以在这里举例

http://isotope.metafizzy.co/demos/combination-filters.html

单击"红色"时，我希望能够切换它。因此，单击一次时，它会向我显示所有红色，再次单击时，它将再次显示所有红色。此外，我希望能够选择多个按钮，例如"红色"和"蓝色"，这将向我显示红色和蓝色。如果我再次单击其中一个，它将保持选中另一个并隐藏切换的那些。这应该能够与其他过滤器结合使用，并且这些过滤器应该以相同的方式工作，具有切换功能。这甚至可以实现吗？我尝试将上述链接中的同位素多个过滤器插件与从这个小提琴中获取的isoSelecter组合在一起，但没有运气。

这是我使用过的一些代码和我创建的小提琴，但它不起作用

$(function(){
var $container = $('#tiles .inner'),
    filters = {};
 $container.isotope({
    animationOptions: {
        duration: 1000,
        queue: false
    },
    itemSelector : '.tile',
    masonry: {
        columnWidth: 130,
        gutterWidth: 41
    }
});
// filter buttons
$('.filter li').click(function(){
  var $this = $(this);
  // don't proceed if already selected
  if ( $this.hasClass('selected') ) {
    return;
  }
  var $optionSet = $this.parents('.filter');
  // change selected class
  $optionSet.find('.selected').removeClass('selected');
  $this.addClass('selected');
  // store filter value in object
  // i.e. filters.color = 'red'
  var group = $optionSet.attr('data-filter-group');
  filters[ group ] = $this.attr('data-filter');
  // convert object into array
  var isoFilters = [];
  for ( var prop in filters ) {
    isoFilters.push( filters[ prop ] )
  }
  var selector = isoFilters.join('');
  $container.isotope({ filter: selector });
//$container.isoSelective({
//      filter: '.filter-nav',
//      attrSelector: 'data-filter'
//});
  return false;
});

}）;

http://jsfiddle.net/AcFAe/

任何帮助将不胜感激。提前致谢

Answer 1

isoSelective 一度使用 .live() 方法，在 jQuery 1.9 中完全删除了该方法。

你需要jquery-migrate jquery-migration对我不起作用。

我刚刚更新了isoSelectary以兼容jQuery 1.9+：https://github.com/simmerdesign/jquery-isoselective