jQuery - Znajdź aktywna zakładka

Question

Mam listę zakładek:

<ul class="tabs"> 
<li><a data-id="1" href="#">AAA</a></li> 
<li><a data-id="2" href="#" class="active">BBB</a></li> 
<li><a data-id="3" href="#">CCC</a></li> 
</ul> 

to mam przycisk:

<div id="button">Click Me</div> 

Jak mogę, gdy kliknięcie na przycisk, dostęp do elementów, które mają klasa aktywna? Muszę mieć możliwość uzyskania identyfikatora danych z aktywnego elementu.

Tak, coś takiego ... (to nie działa!)

$("#button").live("click", function(){ 

     var ref_this = $("ul.tabs li a").find(".active"); 
     alert(ref_this.data("id")); 

}); 

Answer 1

Już wybrano a i find() wyszukania potomkowie . Spróbuj to zamiast: notatka

var ref_this = $("ul.tabs li a.active"); 

niepożądane: live() jest nieaktualna od wersji 1.7. on() to nowa gorliwość.

Answer 2

Spróbuj zamiast na żywo:

$("#button").on("click", function(){ 

     var ref_this = $("ul.tabs li a").find(".active"); 
     alert(ref_this.data("id")); 

}); 

Answer 3

Jak wspomnieli już inni: od jQuery v1.7 metoda live() jest przestarzała.

To powinno działać:

$('#button').on('click', function() { 
    var active_button = $('.tabs li a.active'); 
});` 

Answer 4

Bądź ostrożny, live()jQuery metoda jest deprecated od 1.7 wersji. Należy użyć on()jQuery sposób zamiast (on() jquery documentation) i zmienić selektor CSS tak:

$('#button').on('click', function(){ 
    var ref_this = $('ul.tabs li a.active'); 
    alert(ref_this.data('id')); 
}); 

A jeśli klasa active jest opcjonalne (0 do 1 Nie n.), należy sprawdzić, czy istnieje element active na przykład (tylko prosty sposób to zrobić):

$('#button').on('click', function(){ 
    var ref_this = $('ul.tabs li a.active'); 

    if(ref_this) 
     alert(ref_this.data('id')); 
    else 
     alert('There is no active element'); 
}); 

Answer 5

var activeTab = "AAA"; 
    $("li").click(function(){ 
    activeTab = $(this).text(); 
    });