初始页面加载显示两个选项卡的内容

时间:2017-04-27 02:41:38

标签: html twitter-bootstrap

在初始加载时,一旦首次点击标签页开始按预期工作,两个标签上的内容都会显示在网页上。

有关为何发生这种情况的任何想法?

这是我的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>

1 个答案:

答案 0 :(得分:1)

您的标签(<?php require_once("./commonLogUtils.php"); require_once("./authModel.php"); require_once("./searchModel.php"); session_start(); if (!empty($_REQUEST['action']) && strlen($_REQUEST['action']) <= 0) { $_REQUEST['display'] = "system"; include("./loginView.php"); return; } #subscriptionManagement)都有#locationManagement类,这意味着默认情况下它们都处于活动状态。应该在导航中添加此类,指示应显示内容。您只需要从初始加载时不想显示的选项卡中删除此类:

变化:

active

要:

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

希望这有帮助! :)