jquery - 如何切换类，以便单击主体将关闭下拉菜单并更改剩余项目(jquery)的背景？

Question

有一个下拉菜单，由展开/折叠按钮 (#client-select) 和下拉菜单 (.client-select-dd) 组成。菜单本身工作得很好，只是我希望如果用户单击菜单之外的任何位置，而不是专门再次单击按钮，它也可以折叠。

最初菜单是折叠的，因此第一次单击会更改菜单按钮的背景(#client-select)并使下拉选项可见(.client-select-dd)。第一次单击还会向主体添加一个类(.client-deactivate)。再次单击 (#client-select) 会折叠菜单并恢复按钮图像背景。

在我看来，在菜单打开时单击正文(并且具有“.client-deactivate”类)应该折叠菜单并删除 .client-deactivate，但单击正文绝对不会执行任何操作。感谢大家提供的任何帮助。

$("#client-select").click (function() {
  $("body").toggleClass("client-deactivate");
  $(".client-select-close").toggleClass("client-select-open");
  $(".client-select-dd").toggle();
});

$(".client-deactivate").click (function() {
  $(".client-select-open").toggleClass("client-select-close");
  $(".client-select-dd").toggle();
});

Answer 1

弄清楚了:

$("#client-select").live('点击', function() { $("#client-select").addClass("client-select-open"); $("#client-select").removeClass("client-select-close"); $(".client-select-dd").css("显示", "阻止"); $("body").addClass("客户端停用"); });

$(".client-deactivate").live('click', function() {
  $("#client-select").removeClass("client-select-open");
  $("#client-select").addClass("client-select-close");
  $(".client-select-dd").css("display", "none");
  $("body").removeClass("client-deactivate");
});