Почему в моб.версии меню при клике появляются все субменю?

Question

[kirill270999]

Здравствуйте! пытаюсь решить такую проблему: в меню есть 7 подменю , нажимаю на один элемент, открываются все. Как этого избежать ?

jQuery(document).ready(function() {
    jQuery('.dropdown').click(function(e) {
        jQuery('.menu-depth-0 ').toggleClass('open_mobile_sub');
  
        e.preventDefault();
    });
});

Может нужен другой скрипт?

Comments

[Владимир Брумер]

// css - .open_mobile_sub .menu-depth-0{display:block;}
jQuery(this).toggleClass('open_mobile_sub');//то, что Вы пытаетесь сделать. только класс даем родителю

//через тег a (ссылка), а не тег li (класс dropdown)
jQuery(this).toggleClass('open_mobile_sub').next().slideToggle(); //fadeToggle()
//open_mobile_sub - для стилизации открытого пункта
//next().slideToggle() - будет открывать/закрывать
//либо
jQuery(this).next().toggleClass('open_mobile_sub'); 
//open_mobile_sub - прописываем открытие в стилях
//либо просто
jQuery(this).next().slideToggle(); //fadeToggle()

т.е. нужна конкретика клика по ссылке

пример

jQuery(document).ready(function() {
    jQuery('.dropdown a[href*="javascript"]:not([href*="http"])').click(function() {// :not([href*="http://"],[href*="https://"])
        jQuery(this).next().slideToggle(); 
    });
});

jQuery(this) - работаем только с той ссылкой, по которой кликнули.
next() - следующий элемент за ссылкой, по которой нажали
в Вашем случае это скрытый блок под меню <ul class="sub-menu menu-depth-0">

<li id="menu-item-473" class="dropdown drop-8 menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-473">
	<a href="javascript:void(0);">Одежда</a>
	<ul class="sub-menu menu-depth-0">

slideToggle() - слайдим его



то, что Вы пытаетесь сделать

jQuery(document).ready(function() {
    jQuery('.dropdown a[href*="javascript"]:not([href*="http"])').click(function() {// :not([href*="http://"],[href*="https://"])
        jQuery(this).next().toggleClass('open_mobile_sub'); 
    });
});

з.ы.

Почему в моб.версии меню при клике появляются все субменю?

потому, что обращаетесь ко всем сразу jQuery('.menu-depth-0 ')

[kirill270999]

Владимир Брумер, Спасибо за подробный ответ. все получилось.

Answer 1

[Andy Oker]

jQuery('.dropdown').click(function(e) { 
        e.preventDefault();
        e.currentTarget.toggleClass('open_mobile_sub');
    });

Comments

[kirill270999]

Спасибо за ответ, но у меня почему то выдает ошибку.

[Andy Oker]

kirill270999, html - ку покажешь?)

[kirill270999]

Andy Oker, Код огромный если удобно вот ссылка . Не пугайся , верстка жуть. ссылка

[Andy Oker]

kirill270999, попробуй так

$('#primary-menu').on('click', (e) => {
    let target = e.target
    if (target.href === 'javascript:void(0);') {
        target.nextElementSibling.classList.toggle('open_mobile_sub')
    }
})