WPのスマホハンバーガーメニューがページ内リンクだと閉じない

Question

WPのスマホハンバーガーメニューがページ内リンクだと閉じません。

jsを使っているのですが、おかしいところがありましたら教えて下さい。

	
	var
	  winW = $(window).width(),
		winH = $(window).height(),
		nav = $('#mainnav ul a'),
		curPos = $(this).scrollTop();
	
	if (winW > 800){
		var headerH =0;
	}
	else{
		var headerH =70;
	}
	
	$(nav).on('click', function(){
  	var $el = $(this),
		id = $el.attr('href');
 		$('html, body').animate({
   		scrollTop: $(id).offset().top - headerH
 		}, 500);
		if (winW < 890){
			$('#menuWrap').next().slideToggle();
			$('#menuBtn').removeClass('close');
		}
 		return false;
	});
	
	$('.panel').hide();
	$('#menuWrap').toggle(function(){
		$(this).next().slideToggle();
		$('#menuBtn').toggleClass('close');
	},
	function(){
		$(this).next().slideToggle();
		$('#menuBtn').removeClass('close');
	});

	 $('.nav-menu li a').on('click', function(){
        $(nav).trigger('click');
    });

	$(function() {
		$('#pagetop').click(function () {
			$("html,body").animate({scrollTop:0},"300");
		});
		$('#pagetop').hide();
			$(window).scroll(function () {
				if($(window).scrollTop() > 0) {
					$('#pagetop').fadeIn("slow");
				} else {
					$('#pagetop').fadeOut("slow");
				}
			});
			$("#pagetop").mouseover(function(){
			$(this).hover(
				function () {$(this).fadeTo("fast", 0.10);},
				function () {$(this).fadeTo("fast", 1);}
			);
		});
	});


});

<nav id="mainnav">
<p id="menuWrap"><a id="menu"><span id="menuBtn" class=""></span></a></p>

<div class="panel" style="overflow: hidden; display: none;">
<ul class="nav-menu">
<li id="menu-item-198" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-home current-menu-item page_item page-item-21 current_page_item"><a href="https://ooo.com/"><strong>調査</strong></a></li>
<li id="menu-item-18" class="menu-item menu-item-type-post_type menu-item-object-page"><a href="https://ooo.com/behavior/"><strong>調査</strong></a></li>
<li id="menu-item-357" class="menu-item menu-item-type-taxonomy menu-item-object-category"><a href="https://ooo.com/category/voice/"><strong>お客様事例</strong></a></li>
<li id="menu-item-16" class="menu-item menu-item-type-post_type menu-item-object-page"><a href="https://ooo.com/company/"><strong>会社案内</strong></a></li>
<li id="menu-item-275" class="tabsmt menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home"><a target="_blank" href="https://ooo.com/#reason"><strong>理由</strong></a></li>
<li id="menu-item-276" class="tabsmt menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home"><a target="_blank" href="https://ooo.com/#lawyer"><strong>●●●</strong></a></li>
<li id="menu-item-277" class="tabsmt menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home"><a target="_blank" href="https://ooo.com/#flow"><strong>流れ</strong></a></li>
<li id="menu-item-278" class="tabsmt menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home"><a target="_blank" href="https://ooo.com/#qanda"><strong>質問</strong></a></li>
<li id="menu-item-421" class="tabsmt menu-item menu-item-type-custom menu-item-object-custom"><a href="https://ooo.com/blog/"><strong>ブログ</strong></a></li>
</ul></div>
</nav>

Answer 1

どうなれば閉じた状態になるのかってのが
なんともわからんのであてずっぽですが

ページ内リンクしたときにメニューを閉じた状態にしたいってことであれば

        if (winW < 890){
            $('#menuWrap').next().slideToggle();
            $('#menuBtn').removeClass('close');
        }
↓

        if (winW < 890){
            $('#menuWrap').next().slideUp();
            $('#menuBtn').addClass('close');
        }

なのでは？

Comments

[hinakana]

ありがとうございます。
.removeClass('close');で閉じた状態なんです。

いただいたものを試したみましたが、状態変わらずです。。。

Answer 2

$(this).on('click', function(event) {
$('#menuWrap').trigger('click');
});

で解決しました。ありがとうございました。