Bootstrap5 Navbar 折叠后toggle切换功能无法正常工作问题求助

• 路径错误修正
  你当前引入Bootstrap JS的路径使用了绝对路径写法：

<script src="/assets/js/bootstrap.bundle.min.js" type="text/javascript"></script>

路径开头的/代表从站点根目录寻址，如果你是本地直接打开HTML文件、或是项目存放在子目录下，浏览器会无法找到对应JS文件，导致折叠交互失效。将路径修改为相对路径即可：

<script src="assets/js/bootstrap.bundle.min.js" type="text/javascript"></script>

修改后刷新页面测试，大多数情况下可以直接解决问题。

• 版本一致性校验
  确认你引入的Bootstrap CSS和JS文件均为v5版本：你代码中使用的data-bs-toggle这类属性是Bootstrap 5的专属API标识，如果CSS/JS其中任意一个是v4版本，都会导致交互失效。

• 样式冲突排查
  如果修改路径后仍无效果，检查你自定义的style.css是否存在遮挡折叠按钮的样式：你可以临时给折叠按钮添加测试样式，确认点击区域是否正常：

.navbar-toggler {
  border: 2px solid red !important;
  z-index: 1050 !important;
}

若点击红色边框范围内仍无响应，再确认bootstrap.bundle.min.js文件确实存放在对应目录，文件内容未损坏。

内容的提问来源于stack exchange，提问作者iktefish