elemento filtro basato su .data()/valore

Question

Say Ho 4 elementi div con class .navlink, che, quando cliccato, utilizzare .data() per impostare una chiave denominata 'selected', ad un valore di true:

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

Ogni volta che si fa clic su un nuovo .navlink, desidero memorizzare lo navlink selezionato in precedenza per la successiva manipolazione. C'è un modo semplice e veloce per selezionare un elemento in base a ciò che è stato memorizzato utilizzando .data()?

Non sembrano essere qualsiasi jQuery : filtri che misura la fattura, e ho provato la seguente (all'interno dello stesso evento click), ma per qualche motivo non funziona:

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

So che ci sono altri modi per farlo, ma in questo momento sono per lo più curioso di sapere se è possibile farlo tramite .data().

Answer 1

il filtro avrebbe funzionato, ma è necessario tornare true sugli oggetti corrispondenti nella funzione passata al filtro per poterli afferrare.

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

Answer 2

Sembra più lavoro che il suo valore.

1) Perché non solo una singola variabile JavaScript che memorizza un riferimento all'elemento \ jQuery oggetto attualmente selezionato.

2) Perché non aggiungere una classe all'elemento attualmente selezionato. Quindi puoi interrogare il DOM per la classe ".active" o qualcosa del genere.

Answer 3

Due cose che ho notato (potrebbero essere errori da quando lo hai scritto però).

1. ti sei perso un punto nel primo esempio ($('.navlink').click)
2. Per filtri a lavorare, è necessario restituire un valore (return $(this).data("selected")==true)

Answer 4

Solo per la cronaca, è possibile filtro sui dati con jQuery (questa domanda è abbastanza vecchio, e jQuery si è evoluta da allora, quindi è diritto di scrivere questa soluzione così):

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

o meglio (per le prestazioni):

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

o, se si desidera ottenere tutti gli elementi con data-selected set:

$('[data-selected]') 

Nota che questo metodo funziona solo con dati che sono stati impostati tramite HTML-attributi. Se imposti o modifichi i dati con la chiamata .data(), questo metodo non funzionerà più.

Answer 5

Possiamo fare una funzione abbastanza facilmente:

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

Usage (controllo di un pulsante di opzione):

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