โดยทั่วไปเกี่ยวกับ $ (). แท็บ () ใช้เพื่อสลับระหว่างหน้าแท็บและชิ้นส่วนเนื้อหาลิงก์แคปซูลหรือไปยังการนำทางหน้าสำหรับเนื้อหาที่เกี่ยวข้อง:
<ul id = "mytab"> <li> <a href = "#home"> home </a> </li> <li> <a href = "#profile"> โปรไฟล์ </a> </li> <li> <a href = "#ข้อความ"> </a> </li> <li> id = "home"> ... </div> <div id = "โปรไฟล์"> ... </div> <div id = "ข้อความ"> ... </div> <div id = "การตั้งค่า"> ... </div> <script> $ (function () {$ ('#mytab a: last') e.preventDefault (); // บล็อกพฤติกรรมการกระโดดของลิงก์ $ (นี้) .tab ('show'); // แสดงลิงก์ที่เลือกในปัจจุบันและเนื้อหาที่เกี่ยวข้อง})}) </script>นอกจากนี้คุณสามารถมีวิธีที่ยืดหยุ่นมากขึ้นในการเปิดใช้งานแท็บเฉพาะ:
$ ('#mytab a [href = "#profile"]') แท็บ ('show'); // เลือกแท็บตามชื่อ $ ('#mytab A: First') แท็บ ('show'); // เลือกแท็บแรก $ ('#mytab a: สุดท้าย') แท็บ ('show'); // เลือกแท็บสุดท้าย $ ('#mytab li: eq (2) a'). แท็บ ('show');สิ่งหนึ่งที่ต้องสังเกตในรหัสข้างต้นคือแท็ก A ในแต่ละ Li ต้องมี href =#id ซึ่งชี้ไปที่ ID ของเนื้อหาที่สอดคล้องกับลิงก์ หากใช้ JavaScript เพื่อเปลี่ยนเนื้อหาการนำทางไม่จำเป็นต้องเพิ่ม data-toggle = 'แท็บ' ลงในแท็ก A แน่นอนถ้าแต่ละลิงก์ A ใช้แอตทริบิวต์นี้ไม่จำเป็นต้องใช้ JS เพื่อนำไปใช้