Закрыть бургер меню при нажатии на ссылку

Question

Имеется код для бургер меню

$(document).ready(function() {
  $('.header_burger').click(function(event) {
    $('.header_burger, .header_menu').toggleClass('active');
    $('body').toggleClass('lock')
  });
});

  <div class="header_body" >
                    <div class="header_burger">
                        <span> </span>
                    </div>
                    <nav class="header_menu" >
                        <ul class="header_list" data-aos="zoom-in-left">
                           <li>
                               <a href="#header" class="header_link">Главная</a>
                           </li>
                            <li>
                               <a href="#studio" class="header_link">О нас</a>
                           </li>
                            <li>
                               <a href="" class="header_link">Услуги</a>
                           </li>
                            <li>
                               <a href="" class="header_link">Наши работы</a>
                           </li>

                            <li>
                               <a href="" class="header_link"> Контакты</a>
                           </li>
                            
                        </ul>
                    </nav>
                </div>

как мне его усовершенствовать, что бы при нажатии на ссылку меню закрывалось?

Answer 1

Решил вопрос таким кодом

`$(document).ready(function() {
    $('.header_burger').click(function(event) {
        $('.header_burger, .header_menu').toggleClass('active');
        $('body').toggleClass('lock')
    });
});

$(document).ready(function() {
    $('.header_link').click(function(event) {
        $('.header_burger, .header_menu').removeClass('active');
        $('body').removeClass('lock')
    });
});`

Answer 2

Я сделал это таким образом:

$(document).ready(()=> {
    $(document).on('click', '.header_burger', ()=> {
        $('.header_burger, .header_menu').toggleClass('active');
        $('body').toggleClass('lock');
    });
    $(document).on('click', '.header_list > li > a', e => {

        /* Вот этот отрезок не обязателен! */
        e.preventDefault();
        let url = $(e.target).attr('href');
        location.href = url;

        $('.header_burger, .header_menu').removeClass('active');
        $('body').removeClass('lock');
    });
});

БЛОГ НА HUSL

Закрыть бургер меню при нажатии на ссылку

Ответы (2 шт):