Html 引导4数据切换="；标签"；不改变内容

我试图在Bootstrap 4的导航栏中使用data toggle=“tab”函数，但我不明白为什么我的选项卡没有改变。我用精简的代码制作了一个代码笔：

家庭内容
查找数据内容
建议数据内容
关于

您的笔中没有包含jQuery之前的引导。一旦您这样做，它就会开始工作：

---

奇怪的是，在我的开发环境中，JQuery在引导之前，但在那里不起作用。您的

ul

包含选项卡需要添加类

nav

：

<nav class="navbar navbar-expand-md p-0" role="navigation" id='header-nav'>
         <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
          </button>

         <div class="collapse navbar-collapse">
                    <ul class="navbar-nav" id="myTab" role="tablist">
                        <li class="nav-item"><a class="nav-link main-nav active" id="home-nav" data-toggle="tab" href="#home-content" aria-controls="home-content" aria-selected="true">Home</a></li>
                        <li class="nav-item"><a class="nav-link main-nav" id="find-data-nav"  data-toggle="tab" href="#find-data-content" aria-controls="find-data-content" aria-selected="false">View Inventory</a></li>
                        <li class="nav-item"><a class="nav-link main-nav" id="suggest-data-nav" data-toggle="tab" href="#suggest-data-content" aria-controls="suggest-data-content" aria-selected="false">Suggest a Data Rescue</a></li>
                        <li class="nav-item"><a class="nav-link main-nav" id="about-nav" data-toggle="tab" href="#about-content" aria-controls="about-content" aria-selected="false">About</a></li>
                    </ul>
           </div>
</nav>

<div id="home-content" class="tab-pane fade show active" aria-labelledby="home-nav">
     Home Content
</div>

 <div id="find-data-content" class="tab-pane fade" aria-labelledby="find-data-nav">
   find data content
</div>

<div id="suggest-data-content" class="tab-pane fade" role="tabpanel" aria-labelledby="suggest-data-nav">
            suggest data content
</div>

 <div id="about-content" class="tab-pane fade" role="tabpanel" aria-labelledby="about-nav">
   About
</div>