ページ内遷移するとドロワーメニューが閉じない＠jQuery

ハンバーガーメニュー（ドロワーメニュー）でページ内リンクをタップすると、ページ内の位置は変化するのですが、その上に展開しているメニュー（ハンバーガー）が閉じず、コンテンツが見えないという不具合に遭遇。

確認のためのデモページを用意する余裕がないので自分向け備忘録として。（該当コード部分を見ればすぐわかると思いますが）

$(function() {
    $('#nav_toggle').click(function(){ // headerにclass名「open_nav」を追加及び削除
        $('header').toggleClass('open_nav');
    });

    $('nav a').on('click', function(){
        if (window.innerWidth <= 768) {
            $('#nav_toggle').click();
        }
    });
});

後半のブロックが不具合への対応です。前半のブロックはドロワーメニューである#nav_toggle要素に対してtoggleClassでclass名を追加、除去をしています。これだけだとページ遷移をしないとドロワーメニューは展開したままで閉じません。

そこで後半のブロックで、ドロワーメニューをクリック（タップ）した時のクリックイベントを設定して、メニューの各項目（nav aがそれにあたります）がクリック（タップ）されたらドロワーメニュー（#nav_toggle）がクリックされるようにしています。

この記述により、ページ内リンクであってもメニューが閉じます。（展開した状態のままにならない）

注）innerWidthの指定は必要です。

最近シングルページで完結しているWebサイトも増えてきてるので、これからけっこうこういう場面に遭遇するかもしれないので残しておきます。（いまのところ私は今回の件だけですが）

以下、stack overflowにお世話になりました。Twitter Bootstrapでの問題（への対応）となっていますが、もちろん同じような実装方法をとっていればBootstrapでなくても使えます。（私もBootstrap環境ではなかったです）

stackoverflow.com