Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

347
Vistas
jQuery - how to get data name?

I have many div with "data-value" attribute. But only one with class name ".selected". I need to make selector with both. Data + class name.

How to make selector with data atribute and class name ?

HTML

<div data-value="x">Click Me!</div>
<div data-value="y">Click Me!</div>
<div class='selected' data-value="z">Click Me!</div>
<div data-value="w">Click Me!</div>

jQuery

alert( $("div[data-value] .selected").data('value') );  // this is wrong way...
about 4 years ago · Santiago Trujillo
3 Respuestas
Responde la pregunta

0

There are two ways to get data attribute:

$(".selected").attr('data-value');  // It works for all type of custom attribute

or

$(".selected").data('value');  // This one is specially for data attribute
about 4 years ago · Santiago Trujillo Denunciar

0

You can do that with jQuery's attr():

alert($('div').attr('data-value'));

But, since there will me more than one divs, better give each one a class (to be more specific):

<div class="clickable" data-value="x">Click Me!</div>
<div class="clickable" id="second" data-value="y">Click Me!</div>
<div class='selected clickable' data-value="z">Click Me!</div>
<div class="clickable" data-value="w">Click Me!</div>

and the jQuery will be:

$('div.clickable').on('click', function(){

    alert($(this).attr('data-value'));

});

Fiddle here: https://jsfiddle.net/hpb5u62e/

about 4 years ago · Santiago Trujillo Denunciar

0

check working example.I have added click event for button

$(document).ready(function(){
    $("button").click(function(){
      alert( $(".selected").attr('data-value') );
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div data-value="x">Click Me!</div>
<div data-value="y">Click Me!</div>
<div class='selected' data-value="z">Click Me!</div>
<div data-value="w">Click Me!</div>
<button>Click me</button>

about 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda