Wie erhalte ich die Klasse des angeklickten Elements?

Ich kann nicht herausfinden, wie ich den classWert des angeklickten Elements erhalte .

Wenn ich den folgenden Code verwende, erhalte ich jedes Mal "node-205" .

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>

Hier ist ein kurzes jQuery-Beispiel, das jedem "li" -Tag ein Klickereignis hinzufügt und dann das Klassenattribut für das angeklickte Element abruft. Ich hoffe es hilft.

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

Ebenso müssen Sie das Objekt nicht in jQuery einschließen:

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

In neueren Browsern erhalten Sie die vollständige Liste der Klassennamen :

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

Sie können classListin älteren Browsern mit emulierenmyClass.split(/\s+/);

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

Ich habe diese Frage gesehen und dachte, ich könnte sie etwas weiter ausbauen. Dies ist eine Erweiterung der Idee, die @SteveFenton hatte. Anstatt ein clickEreignis an jedes liElement zu binden , wäre es effizienter, die Ereignisse von ulunten zu delegieren .

Für jQuery 1.7 und höher

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

Dokumentation: .on()

Für jQuery 1.4.2 - 1.7

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

Dokumentation: .delegate()

Als letzter Ausweg für jQuery 1.3 - 1.4

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

oder

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

Dokumentation: .live()

Dies sollte den Trick tun:

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

Weitere Informationen zur Datei ui.tab finden Sie unter http://jqueryui.com/demos/tabs/#Events

Alle angebotenen Lösungen zwingen Sie dazu , das Element zu kennen, auf das Sie vorher klicken werden . Wenn Sie die Klasse von einem angeklickten Element erhalten möchten, können Sie Folgendes verwenden:

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

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