如何在点击锚链接时关闭移动菜单

Question

我需要有关移动菜单的帮助。我尝试在单击菜单项后查找/添加一些关闭菜单的脚本。谁能帮忙。

我的页面是https://www.institut-vz.si/

因此，当您单击菜单链接时，它会转到该部分，但菜单仍处于打开状态。所以我需要一些脚本，它应该在单击菜单链接后关闭。

当您点击汉堡菜单时，“样式”从 display:none 变为 display:block，并且菜单项获取类“inView current_page_item”。

请帮忙。

<nav id="main-menu" class="menu-header-menu-container">
<ul class="menu menu-toggle-open" style="display: block; overflow: visible;">
    <li id="menu-item-16670" class="menu-item"><a href="#home">Home</a></li>
    <li id="menu-item-16673" class="menu-item  inView current_page_item"><a href="#service">Service</a></li>
    <li id="menu-item-16676" class="menu-item"><a href="#aboutus">About us</a></li>
    <li id="menu-item-16677" class="menu-item"><a href="#contact">Contact</a></li>
</ul>

移动菜单也有这个活动的 JS 代码：

//Mobile Menu
$("#dt-menu-toggle").click(function( event ){
    event.preventDefault();

    var $menu = $("nav#main-menu").find("ul.menu:first");
    $menu.slideToggle(function(){
        $menu.css('overflow' , 'visible');
        $menu.toggleClass('menu-toggle-open');
    });

    var $right = $("nav#main-menu").find("ul.menu-right");
    if( $right.length ) {
        $right.slideToggle(function(){
            $right.css('overflow' , 'visible');
            $right.toggleClass('menu-toggle-open');
        });    
    }       
});

Answer 1

在footer.php中添加这个脚本

jQuery(document).on("click",".menu-item", function(){

    jQuery(".menu-item").closest(".menu").removeClass("menu-toggle-open").hide();
});