如何在菜单项单击时隐藏菜单

Question

我对jQuery不太熟悉，所以我很难实现我想要的相当简单的效果。

现场测试现场

因此，我为我的网站创建了一个反思菜单。如果你调整窗口的大小，你将能够看到移动版本。这很好，除了一件事：

我的菜单中有锚链接，这意味着网站不会在点击时加载新页面，而是向下滚动到锚。我的问题是，当点击其中一个菜单项时，我不知道如何关闭菜单。

目前，这是允许我使用当前菜单功能的脚本(fa栏是汉堡图标，主要移动导航是移动wordpress导航菜单：

jQuery(document).ready(function($) {
var pull        = $('.fa-bars');  
menu        = $('.primary-mobile-nav');  
menuHeight  = menu.height();  
$(pull).on('click', function(e) {  
e.preventDefault();  
menu.slideToggle();  
});
})
jQuery(window).resize(function(){  
var w = $(window).width();  
if(w > 320 && menu.is(':hidden')) {  
menu.removeAttr('style');  
}  
});

我想总结一下，我的问题是：如何添加到脚本中，以便当我单击任何菜单项时，菜单再次隐藏？

编辑

所以我实际上通过添加另一个变量来解决这个问题，我称之为"回调"，并将其分配给"菜单项a"，然后我就这样调用了函数：

$(pullback).on('click', function(e) {  
e.preventDefault();  
menu.slideToggle();  
});

我会查看我在这里得到的其他答案，看看这些解决方案是否更好：)

Answer 1

//When we click on a menu item
$('#menu-mobile-navigation li').click(function(){
//Hide the menu 
$('.primary-mobile-nav').hide();
});

希望这能帮助

Answer 2

试试这个jQuery片段。

$("#menu-mobile-navigation a").each(function(){
$(this).click(function(){
menu.slideToggle();
});
});

祝你好运。