引导导航栏在暴徒视图中不起作用当我点击按钮时，下拉菜单不会显示

Question

<nav class="navbar navbar-expand-lg mt-md-4 navbar-dark">
<div class="container px-0">
<a class="navbar-brand" href="#">
<img src="./img/icon-assets/purple-tutor-logo.png" alt="" />
</a>
<button
class="navbar-toggler custom-toggler"
type="button"
data-toggle="collapse"
data-target="#navbarNav"
aria-controls="navbarNav"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<div class="mr-auto"></div>
<ul class="navbar-nav">
<li class="nav-item" data-interval="3000">
<a class="nav-link" href="#">Courses</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About Us</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">How it Works</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">FAQs</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">School Registration</a>
</li>
<li class="nav-item">
<a
class="nav-link btn btn-lg btn-nav"
href="https://study.purpletutor.com/register"
>Get a FREE TRIAL!</a
>
</li>
</ul>
</div>
</div>
</nav>

这是我的导航栏，有人能告诉我错误是什么吗？为什么在暴徒视图中，当我点击按钮时，折叠菜单没有显示

这是我正在使用的脚本，我正在使用bootstrap 4 cdn。有人能帮我吗？我已经检查了多篇关于堆栈溢出的文章

<script
src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"
integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN"
crossorigin="anonymous"
></script>
<script
src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"
integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV"
crossorigin="anonymous"
></script>

Answer 1

您的代码中没有错误，您只缺少用于在移动设备上工作的下拉列表的jquery，请在引导脚本之前添加它，如下所示：

<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script
src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"
integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN"
crossorigin="anonymous"
></script>
<script
src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"
integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV"
crossorigin="anonymous"
></script>