Elemento do filtro baseado em .data () chave / valor

Question

Say I tem 4 elementos div com .navlink classe, que, quando clicado, o uso .data() para definir uma chave chamada 'selected', para um valor de true:

$('.navlink')click(function() { $(this).data('selected', true); })

Cada vez que um novo .navlink é clicado, eu gostaria de armazenar o navlink previamente selecionado para a manipulação posterior. Existe uma maneira rápida e fácil de selecionar um elemento com base no que foi armazenado usando .data()?

Há não parecem ser qualquer jQuery : filtros que se encaixam no projeto de lei, e eu tentei o seguinte (dentro do mesmo evento do clique), mas por algum motivo ele não funciona:

var $previous = $('.navlink').filter( 
    function() { $(this).data("selected") == true }
);

Eu sei que existem outras maneiras de conseguir isso, mas agora eu estou na maior parte apenas curioso para saber se isso pode ser feito via .data().

Answer 1

seu filtro iria funcionar, mas você precisa retornar verdadeiro em objetos de correspondência na função passado para o filtro para que possa agarrá-los.

var $previous = $('.navlink').filter(function() { 
  return $(this).data("selected") == true 
});

Answer 2

Apenas para o registro, você pode filtro em dados com jquery (esta pergunta é bastante antiga, e jQuery evoluiu desde então, por isso é direito de escrever esta solução também):

$('.navlink[data-selected="true"]');

ou, melhor (para desempenho):

$('.navlink').filter('[data-selected="true"]');

ou, se você quiser obter todos os elementos com set data-selected:

$('[data-selected]')

Nota que este método só irá funcionar com os dados que foram definidos através de html-atributos. Se você definir ou alterar dados com a chamada .data(), este método não funcionará mais.

Answer 3

Nós podemos fazer um plugin muito facilmente:

$.fn.filterData = function(key, value) {
    return this.filter(function() {
        return $(this).data(key) == value;
    });
};

Uso (verificação de um botão de rádio):

$('input[name=location_id]').filterData('my-data','data-val').prop('checked',true);

Answer 4

Duas coisas que eu notei (eles podem ser erros de quando você escreveu-o embora).

1. Você perdeu um ponto no primeiro exemplo ($('.navlink').click)
2. Para filtro para o trabalho, você tem que retornar um valor (return $(this).data("selected")==true)

Answer 5

soa como mais trabalho do que o seu valor.

1) Por que não apenas tem uma única variável JavaScript que armazena uma referência para o elemento selecionado no momento \ jQuery objeto.

2) Por que não adicionar uma classe para o elemento selecionado no momento. Então você pode consultar o DOM para a classe ".active" ou algo assim.