Bootstrap 4 導航欄切換圖標不起作用
[英]Bootstrap 4 Navbar Toggle Icon Doesn't Work
問題描述
我在下面有一個 HTML 文件。 當我把瀏覽器變小時，我可以看到漢堡菜單，但是當我點擊它時，什么也沒有發生。
<nav class="navbar navbar-expand-lg navbar-light">
<a href="/" class="navbar-brand">Homepage</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavDropdown">
<ul class="navbar-nav mr-auto">
<!-- left side -->
</ul>
<ul class="navbar-nav">
<!-- right side -->
{% if user.is_authenticated %}
<li class="nav-item ml-3 mr-3">
<a class="nav-link" href="#">{{user.username}}</a>
</li>
<li>
<a class="nav-link" href="{% url 'logout'%}">Log out</a>
</li>
{% else %}
<li class="nav-item ml-3 mr-3">
<a class="nav-link" href="{% url 'login'%}">Log In</a>
</li>
<li>
<a class="nav-link" href="{% url 'signup' %}">Sign Up</a>
</li>
{% endif %}
</ul>
</div>
</nav>
2 個解決方案
解決方案1
1 2021-10-14 02:43:31
我的錯誤是多么愚蠢！
我忘記加載 bootstrap js 文件了！
解決方案2
1 2021-10-14 11:37:55
添加這個：
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.10.2/dist/umd/popper.min.js" integrity="sha384-7+zCNj/IqJ95wo16oMtfsKbZ9ccEh31eOz1HGyDuCQ6wgnyJNSYdrPa03rtR1zdB" crossorigin="anonymous"></script>
到<body>的底部。 進一步閱讀引導 CDN
導航欄中的引導程序切換不起作用
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.