同位素过滤器按钮和搜索字段

时间:2016-06-20 17:28:43

标签: javascript filtering isotope

我尝试过这种方法:Filters + Search with Isotopes Breaks Search?

但它对我没用。

不知何故只有1个可以工作,以前没有搜索栏,我的过滤按钮很好。但是,在我实现搜索框后,只有搜索框正在运行。

请看一下(滚动到投资组合):http://sgweddingcollective.com/

点击任何按钮都不会做任何事情,但如果我在搜索框中输入了一方,则无效。

请帮助我让搜索字段和我的过滤器按钮一起工作,谢谢!



$( function() {
  // quick search regex
  var qsRegex;
  
  // init Isotope
  var $container = $('.isotope').isotope({
    itemSelector: '.gallery-inner',
    layoutMode: 'fitRows',
  });

  function searchFilter() {
    qsRegex = new RegExp( $quicksearch.val(), 'gi' );
    $container.isotope({
    filter: function() {
     return qsRegex ? $(this).text().match( qsRegex ) : true;
    }
  });
}  
  // use value of search field to filter
  var $quicksearch = $('#quicksearch').keyup( debounce( searchFilter ) );
  
  $('#reset').on( 'click', function() {
    $quicksearch.val('');
    searchFilter()
  });
  
});

// debounce so filtering doesn't happen every millisecond
function debounce( fn, threshold ) {
  var timeout;
  return function debounced() {
    if ( timeout ) {
      clearTimeout( timeout );
    }
    function delayed() {
      fn();
      timeout = null;
    }
    setTimeout( delayed, threshold || 100 );
  }
}




0 个答案:

没有答案
相关问题