Bootstrap3导航选项卡不切换选项卡

Question

这是目前我正在使用的代码。

我希望它能够切换选项卡，但它没有。我试过取消积极的类，但它仍然不起作用。

我遵循了一个不需要JavaScript的教程。

谁能帮我找出为什么它不工作?

<div class="nav">
<ul class="nav nav-tabs">
 <li class="active"><a data-toggle="tab" href="#Home">Home</a></li>
 <li><a data-toggle="tab" href="#Tournaments">Tournaments</a></li>
 <li><a data-toggle="tab" href="#About">About</a></li>
 <li><a data-toggle="tab" href="#Contact">Contact</a></li>
</ul>
</div>
<div class="tab-content">
<div id="Home" class="tab-pane fade">
<h3> example </h3>
</div>
    <div id="Tournaments" class="tab-pane fade">
    <h3>create images to show for new pages</h3>
    </div>
        <div id="About" class="tab-pane fade">
        <h3>6214</h3>
        </div>
            <div id="Contact" class="tab-pane fade"> 
            <h3>exds</h3>   
            </div>      
</div>

Answer 1

您缺少所有的javascript。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>

参考:https://codepen.io/jrcanicula/pen/vmojRG