Html 引导：将分页与动态选项卡式界面相结合

我有个问题。我尝试将引导分页与Bootstap NAV中的动态选项卡式接口结合起来。首先，它是有效的，但是在点击它们之后，链接就不再有效了。 如果我点击他们，他们不会切换标签。 id锚有问题吗

    <nav aria-label="Page navigation example">
    <ul class="pagination">
        <li class="page-item"><a class="page-link" href="#">Previous</a></li>
        <li class="page-item"><a class="page-link" href="#">1</a></li>
        <li class="page-item"><a class="page-link" id="pills-home-tab" data-toggle="pill" href="#pills-home" role="tab" aria-controls="pills-home" aria-selected="true">2</a></li>
        <li class="page-item"><a class="page-link" id="pills-profile-tab" data-toggle="pill" href="#pills-profile" role="tab" aria-controls="pills-profile" aria-selected="false">3</a></li>
        <li class="page-item"><a class="page-link" id="pills-contact-tab" data-toggle="pill" href="#pills-contact" role="tab" aria-controls="pills-contact" aria-selected="false">Next</a></li>
    </ul>
</nav>


<div class="tab-content" id="pills-tabContent">
    <div class="tab-pane fade show active" id="pills-home" role="tabpanel" aria-labelledby="pills-home-tab">Test</div>
    <div class="tab-pane fade" id="pills-profile" role="tabpanel" aria-labelledby="pills-profile-tab">Test2</div>
    <div class="tab-pane fade" id="pills-contact" role="tabpanel" aria-labelledby="pills-contact-tab">Test3</div>
</div>

试验
测试2
测试3

访问此链接：-我尝试了页面上的提示，并检查了代码以查看是否与我的有所不同。这没有帮助：(