Pergunta

Eu tenho um número de jquery isótopo de filtros e classificação.Tudo funciona muito bem, mas eu gostaria de criar um botão de reset.

Eu tentei o seguinte (http://stackoverflow.com/questions/10297558/isotope-reset-all-combination-filters) , mas enquanto ele não parece repor os itens (no segundo clique), não redefinir os botões de filtro.

Foi útil?

Solução

Eu só posso supor que você quer dizer "não repor a aparência os botões de filtro" ao escrever

[...] não redefinir os botões de filtro.

Se esse for o caso, e a aparência do seu filtro de botões é controlado por CSS-classes, assim como no Isótopo exemplos, você simplesmente tem que remover disse: classe CSS(es) do botão de filtro elementos quando um usuário clica em "reset"do botão.

Na origem de email.g. Isótopo de "a Combinação de filtros'-demonstração você vai encontrar o seguinte código que lida com tudo o que acontece quando uma das filtro-botões é clicado:

// filter buttons
$('.filter a').click(function(){
  var $this = $(this);
  // don't proceed if already selected
  if ( $this.hasClass('selected') ) {
    return;
  }

  var $optionSet = $this.parents('.option-set');
  // 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-value');
  // convert object into array
  var isoFilters = [];
  for ( var prop in filters ) {
    isoFilters.push( filters[ prop ] )
  }
  var selector = isoFilters.join('');
  $container.isotope({ filter: selector });

  return false;
});

O importante de código (espero) relacionadas à sua pergunta pode ser encontrada nestas linhas:

$optionSet.find('.selected').removeClass('selected');
$this.addClass('selected');
  • a primeira linha remove todos os 'selecionado'-classes de todos os elementos em $optionSet (o último sendo simplesmente um conjunto de botões de direcionamento de um simples filtro de propriedade)
  • o segundo define o 'escolhido'de classe para o elemento que o usuário clicou no
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top