javascript - レスポンシブ メニューが 2 つあります。javascript を編集して、一方が開いているときに他方を閉じるにはどうすればよいですか?

Question

以下のjsfiddleに似たページに2つのレスポンシブメニューがあります。レスポンシブな「メニュー」テキスト リンクを表示するためにウィンドウを最小化すると、現在、一方が開かれ、もう一方をクリックすると、両方とも開いたままになります。一方が開くと他方が閉じるようにJavaScriptを編集するにはどうすればよいですか？助けてくれてありがとう。

http://jsfiddle.net/Jq6sZ/

$(document).ready(function() {
  $('body').addClass('js');
      var $menu = $('#menu'),
          $menulink = $('.menu-link'),
          $menuTrigger = $('.has-subnav > a');

    $menulink.click(function(e) {
        e.preventDefault();
        $menulink.toggleClass('active');
        $menu.toggleClass('active');
    });

    $menuTrigger.click(function(e) {
        e.preventDefault();
        var $this = $(this);
        $this.toggleClass('active').next('ul').toggleClass('active');
    });

    });$(document).ready(function() {
  $('body').addClass('js');
      var $menu = $('#menu2'),
          $menulink = $('.menu-link2'),
          $menuTrigger = $('.has-subnav > a');

    $menulink.click(function(e) {
        e.preventDefault();
        $menulink.toggleClass('active');
        $menu.toggleClass('active');
    });

    $menuTrigger.click(function(e) {
        e.preventDefault();
        var $this = $(this);
        $this.toggleClass('active').next('ul').toggleClass('active');
    });

    });

Answer 1

selector.removeClass('active');
$(this).toggleClass('active');

これは、いずれかのセレクターでアクティブなクラスを削除し、このクラスをアクティブにすることを意味します。