初始頁面加載顯示兩個選項卡的內容

Question

在初始加載時，兩個選項卡中的內容都顯示在網頁上，一旦第一次單擊該選項卡，它們就會按預期工作。

爲什麼會發生這種情況的任何想法？

這裏是我的html

<div id="userFunctions" style="display: none;" > 
    <h2 id="welcome"></h2> 
    <button id="btnChangeUser" class="btn btn-primary" style="display: none;">Change User</button> 
    <br> 
    <hr> 
    <ul class="nav nav-tabs"> 
     <li class="active"><a id="showSubs" data-toggle="tab" href="#subscriptionManagement">Subscription Portal</a></li> 
     <li><a id="showLocation" data-toggle="tab" href="#locationManagement">Location Management</a></li> 
    </ul> 
    <div class = tab-content> 
     <div id="subscriptionManagement" class="tab-pane fade in active"> 
     <hr> 
     <section id="sendSubRequest"> 
      <h4>Request Subscription</h4> 
      <div class="input-group"> 
       <input type="text" id="subUserName" class="form-control "></input> 
       <span class="input-group-btn"> 
       <button id="btnSubUser" class="btn btn-primary">Subscribe</button> 
       </span> 
      </div> 
     </section> 
     <br> 
     <section id="ReviewSubRequests"> 
      <h4>Incoming Request(s)</h4> 
      <ul id='subscriptionsList'> 
      </ul> 
     </section> 
     </div> 
     <div id="locationManagement" class="tab-pane fade in active"> 
     <hr> 
     <section id="cityDetails"> 
      <section id="map"> 
      </section> 
      <br> 
      <section> 
       <button id="btncheckInLocation" class="btn btn-primary">Check-In User location</button> 
      </section> 
     </section> 
     <section id="friendsList"> 
      <h4>Subscribed Friends</h4> 
      <ul id='subscribedUsers'> 
      </ul> 
     </section> 
     </div> 
    </div> 
</div> 

Answer 1

兩個標籤頁（#subscriptionManagement和#locationManagement）有active類，這意味着它們都被激活了。這個類應該在導航上添加，表示應該顯示內容。您只需從您不希望顯示在初始加載選項卡中刪除這個類：

變化：

<div id="locationManagement" class="tab-pane fade in active"> 

要：

<div id="locationManagement" class="tab-pane fade in"> 

希望這有助於！ :)