Как сделать чтобы первый клик открывал саб меню а 2й переходил по ссылке?

Всем привет!
есть такая структура менюшек
<ul class="menu">
                <li class="lvl-1 has-submenu">
                    <a href="category/">Категории</a>
                    <ul class="lvl-2">
                        <li class="has-submenu">
                            <a href="item2/">item2</a>
                            <ul class="lvl-3">
                                <li>
                                    <a href="#">item3</a>
                                </li>
                            </ul>
                        </li>
                    </ul>
                </li>
                <li class="lvl-1 has-submenu">
                    <a href="popular/">Популярные</a>
                    <ul class="lvl-2">
                        <li class="has-submenu">
                            <a href="item2/">item2</a>
                            <ul class="lvl-3">
                                <li>
                                    <a href="#">item3</a>
                                </li>
                            </ul>
                        </li>
                    </ul>
                </li>
                <li class="lvl-1">
                    <a href="#">Создайте свою картину</a>
                </li>
                <li class="lvl-1">
                    <a href="#">Помощь</a>
                </li>
                <li class="lvl-1">
                    <a href="#">Контакты</a>
                </li>
            </ul>

и такой js который открывает саб менюшки
const mMenuParent = document.querySelector('.menu');
    
    mMenuParent.addEventListener('click', ({target: t}) => {
        
        const par = t.parentElement;
        if (t && t.parentElement.classList.contains('has-submenu') || t.parentElement.classList.contains('lvl-2') && t.classList.contains('has-submenu')) {
            const par = t.parentElement;
            console.log('clicked filter');
            // console.log(par);
            par.classList.toggle('mobile_menu_show');
        } 
    });

сейчас все работает так
при клике на ссылку сразу идет переход на эту ссылку, а нужно сделать чтобы 1й клик открывал менюшки, а 2й клик по этой же ссылке уже делал переход
  • Вопрос задан
  • 73 просмотра
Пригласить эксперта
Ответы на вопрос 1
@kuzubina
Как вариант закрыть сслыку каким нить дивом прозрачным через абсолютное позиционирование или псевдоэлементом (before или after) и после первого клика (когда открылась подменюшка) убирать этот див чтобы была доступна ссылка для клика
Или Родителю изначально дать какой нить класс и от этого класса определить ссылке css стиль со значением pointer-events: none; и после первого клика через js убирать этот класс у родителя и будет доступна ссылка для клика
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
19 сент. 2020, в 17:57
900 руб./за проект
19 сент. 2020, в 17:42
500 руб./за проект
19 сент. 2020, в 17:27
500 руб./за проект