单页网站，点击链接后如何关闭导航？

Question

这是结构

<nav class="menu-opener">
    <div class="menu-opener-inner"></div>
</nav>
<nav class="menu">
    <ul class="menu-inner">
      <a href="#about" class="menu-link"><li>About</li></a>
      <a href="#menu" class="menu-link"><li>Menu</li></a>
      <a href="#order" class="menu-link"><li>order</li></a>
      <a href="#direction" class="menu-link"><li>Direction</li></a>
    </ul>
</nav>

我使用的脚本

$(".menu-opener").click(function(){
$(".menu-opener, .menu-opener-inner, .menu").toggleClass("active");
   });   
$("a").on("click", function (e) {
e.preventDefault();
  });

如果您有关于在脚本上添加行的想法，请告诉我。我还是java脚本的新手。

Answer 1

您可能想要删除"active"类，这可能是菜单的打开方式。

$("a").on("click", function (e) {
  e.preventDefault();
  $(".menu-opener, .menu-opener-inner, .menu").removeClass("active");
});