2013-11-03 3 views
7

현재 탭을 BOOTSTRAP에서 활성으로 표시하려고합니다.JS를 통해 현재 활성 탭 가져 오기.

<ul class="nav nav-tabs">    
    <!-- Default tab --> 
    <li class="active"><a href="#elemLower_tab" data-toggle="tab">Elementary Lower</a></li> 
    <li><a href="#elemAdvance_tab" data-toggle="tab">Elementary Advance</a></li> 
    <li><a href="#secondary_tab" data-toggle="tab">Secondary</a></li>    
</ul> 

jQuery를 통해 현재 탭을 활성화하고 싶습니다. 이것을 할 수있는 방법이 있습니까?

답변

29

$('.nav-tabs .active').text() 
+0

탭을 클릭하면 클래스가 변경된다는 것을 알 수 없습니다. 이게 내가 필요한거야. 감사. – newbie

+12

목적지 ID를 얻으려면 $ ('. nav-tabs .active> a')를 사용하십시오. attr ('href') – chok68

0

사용이 코드를 JS보십시오.

$(function(){ 
var url = window.location.pathname, 
urlRegExp = new RegExp(url.replace(/\/$/,'') + "$"); 
$('ul.nav-tabs li a').each(function(){ 
if(urlRegExp.test(this.href.replace(/\/$/,''))){ 
$(this).addClass('active'); 
} 
}); 
}); 

사용 CSS는 : 현재 탭의 변화는 tabs plugin documentation에서 showshown 이벤트를 볼 때마다 자바 스크립트 코드를 실행하려면

ul.nav-tabs a.active{color:#000;} 
+0

그는 클래스를 설정하고 싶지 않고 요소를 얻고 싶습니다. 액티브 한 클래스 – FabianCook

0

에 활성 클래스를 연결합니다.

관련 문제