jquery - texto - Elemento de filtro basado en la clave/valor.data()

obtener el texto de un label jquery

Question

Supongamos que tengo 4 elementos div con la clase .navlink , que, al hacer clic, usa .data() para establecer una clave llamada ''selected'' , en un valor de true :

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

Cada vez que se hace clic en un nuevo .navlink , me gustaría almacenar el navlink previamente seleccionado para su posterior manipulación. ¿Existe una manera rápida y fácil de seleccionar un elemento basado en lo que se almacenó usando .data() ?

No parece haber ningún jQuery : filtros que se ajustan a la factura, y probé lo siguiente (dentro del mismo evento de clic), pero por alguna razón no funciona:

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

Sé que hay otras formas de lograr esto, pero en este momento estoy solo con curiosidad si se puede hacer a través de .data() .

Answer 1

Dos cosas que noté (pueden ser errores de cuando lo escribiste).

1. Te perdiste un punto en el primer ejemplo ( $(''.navlink'').click )
2. Para que el filtro funcione, debe devolver un valor ( return $(this).data("selected")==true )

Answer 2

Parece más trabajo de lo que vale.

1) ¿Por qué no tener una sola variable de JavaScript que almacena una referencia al objeto element / jQuery actualmente seleccionado?

2) ¿Por qué no agregar una clase al elemento seleccionado actualmente? Entonces podrías consultar el DOM para la clase ".active" o algo así.

Answer 3

Podemos hacer un plugin con bastante facilidad:

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

Uso (marcando un botón de opción):

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

Answer 4

Solo para el registro, puedes filtrar los datos con jquery (esta pregunta es bastante antigua, y jQuery evolucionó desde entonces, así que es correcto escribir esta solución también):

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

o, mejor (para el rendimiento):

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

o, si desea obtener todos los elementos con el conjunto data-selected :

$(''[data-selected]'')

Tenga en cuenta que este método solo funcionará con datos que se establecieron a través de atributos html. Si configura o cambia datos con la llamada .data() , este método ya no funcionará.

Answer 5

su filtro funcionaría, pero debe devolver verdadero en los objetos coincidentes en la función pasada al filtro para que los capture.

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