如何访问具有ID的部分并使用Isotope JS过滤（同时）？

Question

下午好！

我在我的网站上使用了名为Isotope JS的出色工具。 在index.html中，创建了一个ID为“ 同位素”的部分，在其中使用了同位素过滤。现在，在其他页面上，我想访问此部分 并进行过滤。

因此，我使用了Hash History方法，并尝试编辑一些内容，例如编辑location.hash，以编写我的URL / filter ='（我用于过滤的类）'

我希望可以访问我的index.html锚，并拥有所需的过滤器，如下所示：

www.mywebsite.com/#isotope/filter =“。redboxes”

或

www.mywebsite.com/#isotope?filter =“。redboxes”

---

这是我的代码的预览。

// filter functions
var filterFns = {
    // show if number is greater than 50
    numberGreaterThan50: function() {
      var number = $(this).find('.number').text();
      return parseInt( number, 10 ) > 50;
    },
    // show if name ends with -ium
    ium: function() {
      var name = $(this).find('.name').text();
      return name.match( /ium$/ );
    }
  };

  function getHashFilter() {
    // get filter=filterName
    var matches = location.hash.match( /filter=([^&]+)/i );
    var hashFilter = matches && matches[1];
    return hashFilter && decodeURIComponent( hashFilter );
  }

  // init Isotope
  var $grid = $('.grid');

  // bind filter button click
  var $filterButtonGroup = $('.filter-button-group');
  $filterButtonGroup.on( 'click', 'button', function() {
    var filterAttr = $( this ).attr('data-filter');
    // set filter in hash
    location.hash = '#isotope/filter=' + encodeURIComponent( filterAttr );
  });

  var isIsotopeInit = false;

  function onHashchange() {
    var hashFilter = getHashFilter();
    if ( !hashFilter && isIsotopeInit ) {
      return;
    }
    isIsotopeInit = true;
    // filter isotope
    $grid.isotope({
      itemSelector: '.element-item',
      layoutMode: 'fitRows',
      // use filterFns
      filter: filterFns[ hashFilter ] || hashFilter
    });
    // set selected class on button
    if ( hashFilter ) {
      $filterButtonGroup.find('.is-checked').removeClass('is-checked');
      $filterButtonGroup.find('[data-filter="' + hashFilter + '"]').addClass('is-checked');
    }
  }

  $(window).on( 'hashchange', onHashchange );

  // trigger event handler to init Isotope
  onHashchange();

有什么想法吗？

我试图在StackOverflow上找到解决方案。但是我什么也没找到。这是我第一次使用IsotopeJS，所以我不知道是否有可能做我需要的事情。

非常感谢！