Javascript 项目选择时自动关闭导航

单击项目时，如何关闭下面的菜单

该菜单是桌面上的固定侧边栏，是移动设备上的切换菜单。这很好，但是菜单在打开时占据了一半的屏幕，当点击导航项时，页面向下滚动到该部分，但菜单保持打开，阻止内容，除非你关闭它，但我不想为访问者添加任何不必要的步骤

多谢各位

这是js

//// NAVBAR COLLAPSE
var rNav = $(".right-nav"),
  hInfo = $(".home .info"),
  home = $(".home"),
  navBtn = $(".slide-nav-btn"),
  navBtnActive = "slide-nav-btn-active",
  nav = $(".slide-nav"),
  navActive = "slide-nav-active",
  rNavSpan = $(".right-nav ul li i"),
  up = $(".up i"),
  body = $("html, body");
rNav.css("top", (home.height() - rNav.height()) / 2);
hInfo.css("top", (home.height() - hInfo.height()) / 2);
navBtn.on("click", function() {
  $(this).toggleClass(navBtnActive);
  nav.toggleClass(navActive)

});

这是HTML

<div class="menu navbar-sp">
                <nav>
                    <ul id="navbar">
                        <li class="active">
                            <a href="#home" data-scroll-nav="0" class="active">
                                <i class="fa fa-home"></i> Home
                            </a>
                        </li>
                        <li>
                            <a href="#about" data-scroll-nav="1">
                                <i class="fa fa-user-o"></i> About
                            </a>
                        </li>
                        <li>
                            <a href="#services" data-scroll-nav="2">
                                <i class="fa fa-tasks"></i> Services
                            </a>
                        </li>
                        <li>
                            <a href="#resume" data-scroll-nav="3">
                                <i class="fa fa-gears"></i> Resume
                            </a>
                        </li>
                        <li>
                            <a href="#portfolio" data-scroll-nav="4">
                                <i class="fa fa-suitcase"></i> Portfolio
                            </a>
                        </li>
                        <li>
                            <a href="#blog" data-scroll-nav="5">
                                <i class="fa fa-comments-o"></i> Blog
                            </a>
                        </li>
                        <li>
                            <a href="#contact" data-scroll-nav="6">
                                <i class="fa fa-envelope-o"></i> Contact
                            </a>
                        </li>
                    </ul>
                </nav>
            </div>

大家好，欢迎来到Stack Overflow！请花点时间阅读一些关于网络的文章。您应该在问题中添加更多代码（HTML会有所帮助）。祝你好运您已将事件侦听器添加到navBtn，只需将相同的事件侦听器添加到anchors标记，即可在单击时从nav中删除活动类：）