单击后隐藏切换菜单

Question

我的网站 https://www.meck.kazuto.de 快完成了。唯一困扰我的是当前的切换菜单。如果您单击 link，它会保持打开状态，但我希望它关闭。

我该怎么做？

<div id="mobil" class="mobil">
        <input type="checkbox" id="menu" name="menu" class="menu-checkbox">

        <div class="menu">

            <label class="menu-toggle" for="menu"><i class="fa fa-bars"></i>
            </label>

            <ul>
                  <label class="menu-hide" for="menu">&times;</label>
                  <li><a href="#wrapper" class="smoothScroll">Home</a>
                  </li>
                  <li><a href="#produkte" class="smoothScroll">Produkte</a>
                  </li>
                  <li><a href="#ueber" class="smoothScroll">Über Uns</a>
                  </li>
                  <li><a href="#so_gehts" class="smoothScroll">So geht's</a>
                  </li>
                  <li><a href="#anfahrt" class="smoothScroll">Anfahrt</a>
                  </li>
            </ul>

    </div>
</div>

Javascript 在移动设备上应该可以正常工作，对吧？但在 xD

之前我从未与 javascript 合作过

Answer 1

由于我们没有太多信息，您可以使用它作为示例。将它放在您的主 js 文件中。

$(".smoothScroll").on('click',function(){
    $(".menu-hide").trigger("click");
});

更好的方法是在您的项目上添加另一个 class 并调用相同的函数 .menu-hide。

单击后隐藏切换菜单

Hide toggle menu after click

html

javascript

jquery

toggle

hide