jQuery .hasClass() für Reiter fehlgeschlagen ändert

Question

Ich habe diese HTML-Struktur:

<div class="tab-pane slide-left padding-20" id="tab1">...</div> 
<div class="tab-pane slide-left padding-20 active" id="tab2">...</div> 
<div class="tab-pane slide-left padding-20" id="tab3">...</div> 

aktuelle aktive Registerkarte wird active Klasse haben, das ist, warum, ich will bedingte Funktion erstellen, um einige Variablen zu behandeln, wenn tab2 aktiv ist mit diesem code:

<script> 
    $(document).ready(function(){ 
     if ($("#tab2").hasClass("active")) { 
      alert ("yes it's active!!"); 
     } 
    }); 
</script> 

aber es funktioniert nicht. Es wird keine Warnmeldung angezeigt, wenn #tab2 aktiv ist. Wie funktioniert das? Danke.

Bitte beachten Sie: Registerkarte Änderungen lädt nicht die ganze Seite neu.

Answer 1

Sie können so etwas tun.

$('.tab-pane').on('click', function() { 
    if ($(this).hasClass("active")) { 
     alert($(this).attr('id') + " it's active!!"); 
    } 
}); 

DEMO

Oder direkt:

$('.tab-pane.active').on('click', function() { 
    alert($(this).attr('id') + " it's active!!"); 
}); 

DEMO

Answer 2

Wenn Sie u singen Jquery UI, können Sie versuchen, diese

Var Aktiv = $ (". Selector"). Tabs ("Option", "aktiv");

Diese Funktion wird funktionieren, wenn Sie Kuppel Aktion wollen basierend auf diesen

$('.selector').tabs({ 
        activate: function(event ,ui){ 
         //console.log(event); 
         console.log(ui.newTab.index()); 
        } 
});