Twitter에서 활성 자식 재설정 부트 스트랩 중첩 된 탭

Question

프로젝트는 3 개의 하위 탭 (c)을 각각 포함하는 3 개의 상위 탭 (P)을 호출합니다.

문제 : 사용자가 P1c3에서 나와 다른 상위 집합으로 이동 한 다음 P1으로 돌아가 c3이 여전히 활성 상태입니다. 누구든지 P1을 열 때 기본 활성 자식을 c1로 재설정하는 방법을 알고 있습니까?

기본 구조입니다.

<div class="tabbable"> 
    <ul class="nav nav-tabs"> 
    <li><a href="#P1" data-toggle="tab">P1</a></li> 
    <li><a href="#P2" data-toggle="tab">P2</a></li> 
    <li><a href="#P3" data-toggle="tab">P3</a></li> 
    </ul> 

<div class="tab-content tab-container"> 

    <div class="tab-pane" id="P1"> 
     <div class="tabbable tabs-left"> 
      <ul class="nav nav-tabs"> 
       <li class="active"><a href="#c1" data-toggle="tab">c1</a></li> 
       <li><a href="#c2" data-toggle="tab">c2</a></li> 
       <li><a href="#c3" data-toggle="tab">c3</a></li> 
      </ul> 
      <div class="tab-content tab-info"> 
       <div class="tab-pane active" id="c1"> 
       P1 child 1          
       </div> 
       <div class="tab-pane" id="c2"> 
       P1 child 2 
       </div> 
       <div class="tab-pane" id="c3"> 
       P1 child 3 
       </div> 
      </div> 
     </div> 
    </div> 

etc... 

Answer 1

상위 항목을 클릭하면 첫 번째 하위 탭에서 $ .trigger를 호출하여 첫 ​​번째 탭으로 다시 설정합니다. 매우 거칠지 만 잘하면 당신은 아이디어를 얻는다.

<ul class="nav parent nav-tabs"> 
    <li><a href="#P1" data-toggle="tab">P1</a></li> 
    <li><a href="#P2" data-toggle="tab">P2</a></li> 
    <li><a href="#P3" data-toggle="tab">P3</a></li> 
</ul> 

<ul class="nav child nav-tabs"> 
    <li class="active"><a href="#c1" data-toggle="tab">c1</a></li> 
    <li><a href="#c2" data-toggle="tab">c2</a></li> 
    <li><a href="#c3" data-toggle="tab">c3</a></li> 
</ul> 

$ ("부모 리가.")에() "클릭"(() 첫번째), 기능() { $를 ('클릭'트리거... "아이의 리튬을 수행하십시오."; }});