약 $ (). 탭 ()은 일반적으로 탭 페이지와 캡슐 링크 컨텐츠 조각을 전환하거나 관련 컨텐츠의 페이지 탐색으로 전환하는 데 사용됩니다.
<ul id = "mytab"> <li> <a href = "#home"> home </a> </a> </li> <li> <a href = "#profile"> profile </a> </li> <li> <a href = "#메시지"> 메시지 </a> </li> <li> <a settings "> setings" id = "home"> ... </div> <div id = "profile"> ... </div> <div id = "message"> ... </div> <div id = "settings"> ... </div> <cript> $ (function () {$ ( '#mytab a : last'); tab ( 'show'); // $ ( '#mytab a'). e.preventDefault (); // 링크 $ (this) .tab ( 'show')의 점프 동작을 차단합니다.또한 특정 탭을 활성화하는보다 유연한 방법을 가질 수 있습니다.
$ ( '#mytab a [href = "#profile"]'). Tab ( 'show'); // 이름으로 탭을 선택하십시오 $ ( '#mytab a : first'). tab ( 'show'); // 첫 번째 탭 $ ( '#mytab a : last'). 탭 ( 'show'); // 마지막 탭 $ ( '#myTab li : eq (2) a'). 탭 ( 'show');
위 코드에서 언급해야 할 한 가지는 각 Li의 A 태그가 href =#id를 가져야하며 링크에 해당하는 컨텐츠의 ID를 가리 킵니다. JavaScript가 내비게이션 컨텐츠를 전환하는 데 사용되는 경우 A 태그에 Data-Toggle = 'Tab'을 추가 할 필요가 없습니다. 물론 각 링크 A 가이 속성을 사용하는 경우 JS를 사용하여 구현할 필요가 없습니다.