jquery - page - ¿Cómo obtener la clase del elemento pinchado?

jquery name attribute

Question

No puedo entender cómo obtener el valor de class del elemento pulsado.

Cuando uso el código de abajo, obtengo "node-205" cada vez.

jQuery:

.find(''> ul'')
.tabs(
{
    selectedClass: ''active'',
    select: function (event, ui) {
        //shows only the first element of list
        $(this).children(''li'').attr(''class'');
    },
    cookie: { expires: 0 },
    fx: fx
})

HTML:

<ul class="tabs">
  <li class="node-205"></li>
  <li class="node-150"></li>
  <li class="node-160"></li>
</ul>

Answer 1

Aquí hay un ejemplo rápido de jQuery que agrega un evento de clic a cada etiqueta "li", y luego recupera el atributo de clase para el elemento pulsado. Espero eso ayude.

$("li").click(function() {
   var myClass = $(this).attr("class");
   alert(myClass);
});

Igualmente, no tiene que envolver el objeto en jQuery:

$("li").click(function() {
   var myClass = this.className;
   alert(myClass);
});

Y en los navegadores más nuevos, puede obtener la lista completa de nombres de clase :

$("li").click(function() {
   var myClasses = this.classList;
   alert(myClasses.length + " " + myClasses[0]);
});

Puede emular classList en navegadores antiguos utilizando myClass.split(//s+/);

Answer 2

Esto debería funcionar:

...
select: function(event, ui){ 
   ui.tab.attr(''class'');
} ,
...

Para obtener más información acerca de ui.tab, consulte http://jqueryui.com/demos/tabs/#Events

Answer 3

Todas las soluciones proporcionadas lo obligan a conocer el elemento en el que hará clic de antemano . Si desea obtener la clase de cualquier elemento pulsado puede utilizar:

$(document).on(''click'', function(e) {
    clicked_id = e.target.id;
    clicked_class = $(''#'' + e.target.id).attr(''class'');
    // do stuff with ids and classes 
    })

Answer 4

Vi esta pregunta, así que pensé que podría ampliarla un poco más. Esta es una expansión de la idea que tuvo @SteveFenton. En lugar de vincular un evento de click a cada elemento li , sería más eficiente delegar los eventos desde la ul hacia abajo.

Para jQuery 1.7 y superior

$("ul.tabs").on(''click'', ''li'', function(e) {
   alert($(this).attr("class"));
});

Documentación: .on()

Para jQuery 1.4.2 - 1.7

$("ul.tabs").delegate(''li'', ''click'', function(e) {
   alert($(this).attr("class"));
});

Documentación: .delegate()

Como último recurso para jQuery 1.3 - 1.4

$("ul.tabs").children(''li'').live(''click'', function(e) {
   alert($(this).attr("class"));
});

o

$("ul.tabs > li").live(''click'', function(e) {
   alert($(this).attr("class"));
});

Documentación: .live()

Answer 5

$("div").click(function() {
  var txtClass = $(this).attr("class");
  console.log("Class Name : "+txtClass);
});

Answer 6

$("li").click(function(){
    alert($(this).attr("class"));
});