부트 스트랩 3 JQuery와 이벤트

Question

내 목표는 부트 스트랩 탐색 폴 클릭 이벤트를 오버로드하는 것입니다, 그리고 내가 코드가 알약 작동하도록 다음과 같은 방법으로 수정 한 this post

건너 행복했다, 그러나 그것이 효과가없는 이유를 이해하는 것은 무력하다.

HTML :

<ul class="nav nav-pills" id="orders_tab"> 
       <li class="active"><a data-toggle="pill" href="#orders_for_today">Текущие</a></li> 
       <li><a data-toggle="pill" href="#orders_sent_to_vendors">Ожидающие</a></li> 
       <li><a data-toggle="pill" href="#inventories">Остатки</a></li> 
       <li><a data-toggle="pill" href="#sales">Продажи</a></li> 
       <li><a data-toggle="pill" href="#sales_aggregate">Аггрегированные продажи</a></li> 
       <li role="presentation" class="dropdown"> 
        <a class="dropdown-toggle" data-toggle = "dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false"> 
         Прочее <span class="caret"></span> 
        </a> 
        <ul class="dropdown-menu"> 
         <li><a href="#">Action</a></li> 
         <li><a href="#orders_products">Продукты</a></li> 
        </ul> 
       </li> 
      </ul> 

JS

$('a[data-toggle="pill"]').on('shown.bs.pill', function (e) { 
     var target = $(e.target).attr("href") // activated tab 
     alert(target); 
    }); 

Answer 1

부트 스트랩 nav-pills aka는 js 구성 요소가 아닌 스타일 구성 요소입니다. 따라서 데이터 토글은 data-toggle="tab"이됩니다. 코드 만 Fiddle

data-toggle="tab" 

에 대한

업데이트 바이올린이 필요로 변경합니다.

- 도움말 :

Answer 2

부트 스트랩 약 및 탭이 같은 자바 스크립트를 사용합니다. .nav-tabs 대신 .nav-pills 만 다릅니다.

data-toggle="pill"을 도처에 data-toggle="tab"으로 바꿔야합니다.