1. 程式人生 > >bootstrap的tab選項卡

bootstrap的tab選項卡

<div class="container">
        <ul class="nav nav-tabs/nav-pills">
            <li class="active"><a href="#A" data-toggle="tab">公告</a></li>
            <li><a href="#B" data-toggle="tab">規則</a></li>
            <li><a href="#C" data-toggle
="tab">
論壇</a></li> <li><a href="#D" data-toggle="tab">內容</a></li> </ul> <br /> <div class="tab-content"> <div class="tab-pane active" id="A">公告內容</div> <div class="tab-pane" id
="B">
規則內容</div> <div class="tab-pane" id="C">論壇內容</div> <div class="tab-pane" id="D">內容內容</div> </div> </div>

這裡寫圖片描述

JS觸發

$(".nav-tabs.li.a").click(function(){
    $(this).tab("show/hide/toggle");
});