data-toggle = "tab", aktywacja drugiej zakładki na stronie ładowania

Question

Wiem, że to pytanie już zostało zadane, przeszedłem poprzednie pytania, ale jakoś nic nie działało dla mnie, więc pomyślałem, że powinienem to opublikować.

Chcę zaznaczyć drugą kartę przy ładowaniu strony i po kliknięciu konkretnego przycisku chcę podświetlić pierwszą kartę.

Ustawienie klasy jako "Tab Pane Active" dla drugiej zakładki nie działa.

<ul class="nav nav-tabs"> 
    <li><a href="#search" data-toggle="tab">Search</a></li> 
    <li><a href="#home" data-toggle="tab">User Details</a></li> 
    <li><a href="#info" data-toggle="tab">More Info</a></li> 
</ul> 
<div class="tab-content" id="tabs"> 
    <div class="tab-pane" id="search">...Content...</div> 
    <div class="tab-pane active" id="home">...Content...</div> 
    <div class="tab-pane" id="info">...Content...</div> 
</div> 

Answer 1

Masz aktywną klasę na drugim panelu karty, pokazując, że początkowo, ale nie na aktualnej karcie li. Widzisz więc zawartość drugiej karty, ale nie wybrany stan na karcie. Trzeba zmienić:

<li><a href="#home" data-toggle="tab">User Details</a></li> 

do

<li class="active"><a href="#home" data-toggle="tab">User Details</a></li> 

i wybrania zakładki z jQuery:

// To select the first tab 
$('.nav-tabs li:first-child a').tab('show'); 
// To select the second tab 
$('.nav-tabs li:eq(1) a').tab('show'); 

Można to wykorzystać na stronie obciążenia, jeśli chcesz (w promieniu $(document).ready() czy cokolwiek używasz), chociaż prawdopodobnie najlepiej jest naprawić znaczniki. Możesz go użyć w swoim detektorze zdarzeń dla swojego przycisku.

Zobacz ten przykład: http://www.bootply.com/kkmcecadLb