Question

我在下拉菜单中使用以下内容。它工作得很好，但是，如果单击正文中的某个位置或单击另一个下拉列表，我无法弄清楚如何获得slideUp的打开下拉列表。

$(document).ready(function () { 
$('.nav li').click(function() {

  var slideToggle = this;
  if ($('ul', this).is(':visible')) {
      $('ul', this).slideUp(function() {
          $(slideToggle).removeClass('active');
      });
  }
  else {
      $('ul', this).slideDown();
      $(slideToggle).addClass('active');
  }
});
});

在此处查看操作：http://jsfiddle.net/Ngh5C/1/

我最简单的方法是什么？

Answer 1

利用事件冒泡并将点击处理程序绑定到合适的父容器（例如正文）。检查处理程序中的目标，如果它不是您的菜单之一，请使用选择器查找打开菜单并关闭它。

这是一个简单的例子作为起点：

http://jsfiddle.net/Ngh5C/6/

尝试这个小提琴，一次只打开一个：

http://jsfiddle.net/Ngh5C/7/

如果你真的只想关闭点击项目的邻居（这是一个奇怪的要求），那么这有效：

http://jsfiddle.net/Ngh5C/8/

单击相邻时关闭下拉列表

1 个答案: