同位素切換組合過濾器

Question

我想使同位素組合過濾器切換，因此這里是示例

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

當點擊“紅色”時，我希望能夠切換它。 因此，單擊一次它將顯示所有紅色，再次單擊將顯示所有紅色。 此外，我希望能夠保持選中的多個按鈕，例如選擇的“紅色”和“藍色”將向我顯示紅色和藍色。 如果我再次單擊其中一個，則會使另一個保持選中狀態並隱藏已切換的按鈕。 這應該能夠與其他過濾器結合使用，並且應該使用切換功能以相同的方式工作。 這甚至可以實現嗎？ 我嘗試將上面鏈接中的同位素多個過濾器插件與從這個小提琴中獲取的isoSelective結合起來，但是沒有運氣。

這是我使用過的一些代碼，以及我創建的小提琴，但是沒有用

$(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-migrate對我不起作用。

我剛剛更新了isoSelective以使其與jQuery 1.9+兼容： https : //github.com/simmerdesign/jquery-isoselective