使用子菜单单击菜单项将在移动设备上打开所有其他子菜单

Question

在下面使用的jQuery函数添加功能以滑动菜单项的子菜单，该子菜单为移动视口提供了孩子。

        $('.submenu-open').click(function(e) {
        $('.menu-item-has-children li').slideToggle('slow');
    });

但是，它同时（在移动视口上）与孩子一起打开所有菜单项，但它只能打开该菜单项的子菜单。

这是 link

Answer 1

虽然这可能不是确切的解决方案，但更多的是您需要的线路。

Vanilla JS，没有JQuery：

document.querySelectorAll('.submenu-open').addEventListener('click', function(event) {
    event.target.querySelector('.menu-item-has-children li').classList.toggle('slow');
})

您的问题是，您并不是只将类添加到单击元素中，而是所有这些元素。

Answer 2

在“单击事件”侦听器的回调函数中，您必须使用jQuery的$（this）对象首先关闭目标。发生。

然后使用方法 childror（） 在该对象上以针对相关的对象无序列表.sub-menu：

$('.submenu-open').click(function(e) {
        $(this).children('.sub-menu').slideToggle('slow');
    });
})