Bootstrap 3.3.6 - Wie man mehrere Elemente über Nav Registerkarten auf einer einzelnen Seite ein-/ausblenden

Question

Innerhalb Bootstrap 3.3.6, ich bekomme, wie nav tab und tab content regions arbeiten. Für jede Registerkarte, auf die Sie klicken, wird ein relationaler Inhaltsbereich angezeigt. Aber in meinem speziellen Fall arbeite ich mit einem 2-Spalten-Layout, das Nav Tabs in einer Spalte hat, und eine zusätzliche private Liste von Links in einer anderen Spalte namens "private-list".

Die Demo kann hier angesehen werden

http://www.bootply.com/NJXUfgD5iE

Wenn ich auf meinem Abschnitt 2 nav Registerkarte klicken, mein Abschnitt 2 Inhaltsbereiche zeigt, wie es mit Bootstrap sollte 3. Aber wie kann ich meine auch sagen. private-Liste, die sich in meiner linken Spalte befindet und nur angezeigt wird, wenn ich auf die Registerkarte Abschnitt 2 und 3 klicke, und dann wieder ausgeblendet wird, wenn ich auf Abschnitt 1 klicke?

Gibt es zum Beispiel einen Klassenprozess (anstatt eines ID-Prozesses), den ich verwenden kann, um mehrere Elemente der Bootrap-Komponente in einem einzelnen Tab zu speichern?

Dank

Answer 1

können Sie Ihre eigenen Click-Handler für die Registerkarten haben:

$('.nav-tabs a').click(function (e) { 
    e.preventDefault(); 
    $(this).tab('show'); 
    if($(this).attr("href") != "#tab1"){ 
    $(".public-list").hide(); 
    $(".private-list").show(); 
    } 
    else{ 
    $(".public-list").show(); 
    $(".private-list").hide(); 
    } 
})