Question

我有一个菜单，菜单项只有在点击时才会显示。要再次隐藏它们，必须再次单击它们。这一切都很好，但是当我点击另一个菜单项时，我还需要隐藏其他可见的菜单项。

我目前正在使用：

$(this).parent().find("element").toggle();

因此，如果菜单项2可见并且单击了菜单项1，则菜单项2需要再次隐藏，并且菜单项1需要可见。怎么做？

Answer 1

您可以点击隐藏/显示元素：

$('.menu-item').on('click', function() {
    var $this = $(this);
    $this.show();
    $this.parent().children('.menu-item').not($this).hide();
});

根据嵌套使用find而不是child。

Answer 2

这个怎么样：

$('.submenu').hide();
$('.menuitem').click(function() {
  var thissubmenu = $(this).find('.submenu');   
  $('.submenu').not(thissubmenu).hide();
  $(this).find(".submenu").toggle();
});

我做了一个JSFiddle，我觉得你正在寻找它。

但也许有人知道更优雅的方式。

如何使用jQuery显示/隐藏菜单？

2 个答案: