Twitter 부트 스트랩 탭 클릭시 변경되지 않음

Twitter Bootstrap v2.1.1 및 tabbable 기능을 사용하고 있습니다.Twitter 부트 스트랩 탭 클릭시 변경되지 않음

문제점 : 탭 버튼 .tab의 상태가 변경되지만 tab-pane이 변경되지 않습니다. 즉, 탭 버튼은 클릭 할 때 눌려 지지만 탭으로 변경해야하는 내용은 그렇지 않습니다. console.log()은 클릭 이벤트가 발생하고 있음을 나타냅니다. 어떤 아이디어?

HTML

<!-- Tab Bar --> 
<div class="tab-bar"> 
    <div class="tab active" id="photos" data-toggle="tab" data-target="#photos"> 
     <p>Photos</p> 
    </div> 
    <div class="tab" id="details" data-toggle="tab" data-target="#details" 
     ><p>Details</p> 
    </div> 
</div> 

<!-- Tab Panes --> 
<div class="tab-content"> 
    <div id="photos" class="tab-pane">Photos</div> 
    <div id="details" class="tab-pane">Details</div> 
</div>

$('.tab-bar').tab(); 
$('.tab-bar .tab').click(function(e) { 
    e.preventDefault(); 
    $(this).tab('show'); 
    console.log('show'); 
})

JS 문제와 우려

<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/js/bootstrap.min.js"></script> 
<script type="text/javascript" src="http://twitter.github.com/bootstrap/assets/js/bootstrap-tab.js"></script>

출처

2012-10-04 Nyxynyx

'탭 이름'은 중첩 된 div 대신 ul/li 여야합니까? http://twitter.github.com/bootstrap/javascript.html#tabs – user2030404

커플을 포함한다 :

src는 bootstrap-tab.js에 직접 Twitter Github 페이지에 연결됩니다. 나는 이것이 트위터 부트 스트랩에 대한 CDN이 될 의도는 없다고 생각합니다. 나는이 파일이 "자신의 dogfood를 먹는다"라고 생각합니다. 즉, Twitter Bootstrap Github 페이지는 설명서 및 다운로드를 위해 Twitter Bootstrap을 사용합니다.

의도 된 것이 아니기 때문에 언제든지 디렉토리 구조 나 버전을 쉽게 변경할 수 있습니다.
bootstrap.min.js와 bootstrap-tab.js를 모두 사용하고 있습니다. bootstrap.min.js에는 bootstrap-tab.js가 포함되어 있고 두 가지 문제를 모두 사용한다고 생각합니다. 다음 게시물을 참조하십시오. https://groups.google.com/forum/?fromgroups=#!topic/twitter-bootstrap/XH_ttp_9yXg
나는 또한 twitter bootstrap 2.1.1을 사용하고 있습니다. 나는 tab-bar을 bootstrap.min.js, bootstrap-tab.js, bootstrap.css에 찾지 못했습니다. 2.1.1 파일을 참조하고 이전 버전의 Twitter Bootstrap을 코딩 할 수 있습니까?

출처

2012-10-04 01:16:02

포인트 # 1과 # 2의 경우,'bootstap-tab.js'에 대한 링크를 제거했지만 여전히 같은 문제에 직면 해 있습니다. '.tab-bar'는 스타일링 목적으로 자신을 정의한 클래스입니다. 부트 스트랩 플러그인은 탭을 포함하는 div에 대해 특정 클래스 이름을 요구합니까? – Nyxynyx

@Nyxynyx이 예와 같이 ** Tabbable 탐색 **을 시도하고 있습니까? http://twitter.github.com/bootstrap/components.html#navs? 네, 제 생각에 부트 스트랩은 특정 클래스 이름을 요구합니다 (물론 추가 스타일링을 제공 할 수 있습니다). 예제로 시작하여 직접 사용자 정의 할 것입니다. –

Twitter 부트 스트랩 탭 클릭시 변경되지 않음

답변

관련 문제