jquery - 如果选择了一个类别，如何隐藏产品树中的其他类别

Question

购物车有产品分类树状

Category1
  Subcategory11
  Subcategory12
  ...
Category2
  Subcategory21
  Subcategory22
  ...
Category3
  Subcategory31
  Subcategory32
  ...

它位于屏幕的左侧。 最初它以折叠形式显示

截图1:

Toggle show all categories
Category1
Category2
Category3

用户可以通过点击打开某个节点。在这种情况下(例如单击类别 2)其他类别应从屏幕上删除，以便只有该类别及其子类别可见:

截图2:

Toggle show all categories
Category2
  Subcategory21
  Subcategory22

Toggle show all categories 链接应切换单个类别和类别 ListView :第一次单击应再次显示折叠的类别列表，如屏幕截图 1 所示。之后再次单击 Toggle show all categories 应该只显示上次打开的类别，如 Screenshot2 中所示。 这在 http://www.officeday.ee/Buroo-pohitoovahendid/ 中实现

如何实现？是否有一些 jquery 或 jquery-ui 插件或者可以为此定制 jqgrid？

如果选择了某些类别，我发现的所有树都会留下主要类别列表

Category1
Category2
  Subcategory21
  Subcategory22
Category3

如截图2选择Category2时要求Category1和Category3消失

目前使用的是 ASP.NET/Mono MVC2、jquery、jquery-ui 和 jqgrid treegrid。如果这导致解决方案，jquery-ui 和 jqgrid 可以替换为其他东西。

Answer 1

为类别提供通用类，例如 .hidden 和 commonClass

hidden{display:none}

$('.category').click(function(){
 $(this).css('display','block')
 $('.commonclass').addClass('hidden')

});

你可以尝试这样的事情......