javascript - 当一个项目在导航中打开时，关闭所有其他宽度 jQuery

Question

我有一个使用 jQuery 打开/关闭的导航。我试图做到这一点，以便当您单击例如。项目 2 如果打开任何其他项目，则应将其关闭。但是现在我无法关闭项目 2。

$(document).ready(

function () {
    $('a.has-child').click(function () {
        $('div.child').not(this).removeClass("open");
        $(this).closest('li').find('div.child').addClass("open");
    });
});

这是一个 fiddle :https://jsfiddle.net/mwcq0yek/

更新:我可以打开项目 4 并关闭项目 2，反之亦然。但我无法单独关闭项目 2 或项目 3。

Answer 1

删除所有 .child 的类。

$('div.child').removeClass("open");

然后给点击的元素添加类open

$(this).closest('li').find('div.child').addClass("open");

Demo

更新

如果你想关闭.child子菜单，你需要做一个测试。您需要做的是测试该子菜单是否有 open 类。

    if ( submenu.hasClass("open") ) {
        submenu.removeClass("open");
    } else {
        $('div.child').removeClass("open");
        submenu.addClass("open");
    }

updated demo