您需要检查折叠是否已显示，然后相应地进行切换。
下面是相同的代码：-
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Bootstrap Collapse Example</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<style>
.body-menu-report-nav {
font-size: 14px;
background-color: #080a70;
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 180px;
transition: none;
color: #fff;
z-index: 10;
align-items: stretch;
box-shadow: -5px 0px 10px 1px #c7c7c7;
}
</style>
</head>
<body>
<a class="btn btn-tocanvas-report" href="#" id="btnOpenSidebarListMenuReport" role="button" aria-controls="listMenuReport">
<span><i class="bi bi-list"></i>Open List Report</span>
</a>
<div class="collapse body-menu-report-nav" id="listMenuReport">
<ul class="ul-menu-report-nav">
<li class="li-menu-report-nav">
<a href="index.php?page=report&report=curloc_report" class="navbar-listmenureport-link">
<i class="bi bi-geo"></i>
<span>Current Location</span>
</a>
</li>
</ul>
</div>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.bundle.min.js"></script>
<script>
const listMenuReport = document.getElementById("listMenuReport"); // Declare div collapse
const btnOpenSidebarListMenuReport = document.getElementById("btnOpenSidebarListMenuReport"); // Declare the button to trigger Open/Close div Collapse
btnOpenSidebarListMenuReport.addEventListener('click', (e) => {
e.preventDefault();
var bsCollapse = new bootstrap.Collapse(listMenuReport, {
toggle: false
});
if (listMenuReport.classList.contains('show')) {
bsCollapse.hide();
} else {
bsCollapse.show();
}
});
// Click Outside Sidebar will Close Collapse
window.addEventListener('click', (e) => {
if (!listMenuReport.contains(e.target) && e.target !== btnOpenSidebarListMenuReport) {
var bsCollapse = new bootstrap.Collapse(listMenuReport, {
toggle: false
});
bsCollapse.hide();
}
});
// Click Inside Sidebar, Sidebar will not Close
listMenuReport.addEventListener('click', (e) => {
e.stopPropagation();
});
</script>
</body>
</html>