0

我有一个显示树视图的角度指令。当您单击 li 图标时，它应该隐藏嵌套的 UL。

这是重要的代码：（这是在单击函数中，其中 e 是单击事件）

$toggler=$(e.target).closest('li');
if($toggler.hasClass("collapsed")){
 $toggler.removeClass("collapsed").addClass("expanded");
} else {
  $toggler.removeClass("expanded").addClass("collapsed");
}
$(".collapsed").find("ul").hide();
$(".expanded").find("ul").show();

我可以在调试器中看到该类被正确分配和删除。但是，它仅适用于我最初将类设置为折叠的第一组 LI。树的更深层次显示类更改，但选择器不适用于它们。有趣的是，当您单击更深的行时，它就像您第一次单击根行一样。之后它什么也不做。

问题：为什么我的选择器不工作？

这是我的 plunkr：http ://plnkr.co/edit/GZ5MZjkir4AaNQmHIxFP?p=preview

4

1 回答 1

1

问题是你先申请.collapsed然后再申请.expanded。因此，如果根扩展，您的孩子总是会扩展。如果你交换它们，它会像预期的那样工作：

$(".expanded").find("ul").show();
$(".collapsed").find("ul").hide();

所以它首先扩展了所有的孩子。然后它到达第一个.collapsed孩子，折叠它。在此之后继续崩溃.collapsed的孩子们没有带来视觉上的差异。

于 2013-10-27T22:19:17.577 回答