JSでナビ（ダブルオープン）

Question

私のJSコードに問題があります。このコードはmegamenuでアクティブなdivですが、同時に2つのメガメニューを開くことができます。私はすでに現在のメガメニューをクリックしたときに消えます。秒がアクティブです。アイデアはありますか？

$(function() { 

    var menuVisible = false; 

    $('.contentLink').click(function() { 

     var office = $(this).attr('data-office'); 

     if (menuVisible) { 
      $('#_' + office).hide(); 
      $(this).removeClass('on'); 
      menuVisible = false; 
      return; 
     } 
     else 
     { 
      $('#_' + office).show(); 
      $(this).addClass('on'); 
      menuVisible = true; 
     } 

    }); 

}); 

<nav> 
    <ul class="menu-links"> 
     <li><a data-office="events" class="contentLink">Events</a> 
      <div class="megamenu center" id="_events"> 
       My mega menu events 
      </div> 
     </li> 
     <li><a data-office="articles" class="contentLink">Articles</a> 
      <div class="megamenu center" id="_articles"> 
       My mega menu articles 
      </div> 
     </li> 
    </ul> 
</nav> 

Answer 1

はい、前にすべてのmegamenuを非表示にするには、あなたのclick()機能に次の行を追加します。私はそれを簡素化するようにコードを編集してきました

$('.megamenu').hide(); 

：

$(function() { 
    $('.contentLink').click(function() { 
     $('.megamenu').hide(); 
     menu = $(this).next(); 
     if(menu.is(':visible')){ 
      menu.hide(); 
     }else{ 
      menu.show();  
     }   
    }); 
}); 

Live example