我正在构建一个具有分层树型结构的页面。我在JSFiddle
发布了简化版本它主要是按照我喜欢的方式工作，但有一点 - 点击关闭我想要的品牌级别的行，以及要收缩的城镇和鞋子行（他们这样做），对于镇上的锚点行将其文本更改为“+”。
我试图用
这样做$(this).parent().parent().nextUntil(".TRBrand", ".TownToggle").text("+");
但是尽量尝试它不会很好玩。
有人能指出我正确的方向......？
答案 0 :(得分：4)
嵌套列表更适合树状结构。您可以看到使用此标记更容易编写js：
答案 1 :(得分：1)
试试这个：
$(this).parent().parent().nextUntil(".TRBrand").find('.TownToggle').text("+");
答案 2 :(得分：1)
希望fiddle能够提供帮助
$(this).parent().parent().nextUntil("tr:not(.TRTown, .TRBrand)", ".TownToggle").text("+");
答案 3 :(得分：1)
您的版本存在多个问题：
最后<a>（对于Reebok）有错误的课程：TRTown而不是TownToggle
nextUntil(...) TownToggle .TRTown仅在.TRBrasnd时停止，这意味着当它是列表中的最后一个城镇并且继续隐藏时，它会隐藏太多下一个品牌也是如此。它也应该停在a.toggleTown上。您可以通过用逗号分隔来指定两个选择器。
+时， $('.BrandToggle').click(function() {
var t = $(this);
var txt = t.text();
var tr = t.closest("tr");
if (txt == "+") {
tr.nextUntil(".TRBrand", ".TRTown").show();
} else {
tr.nextUntil(".TRBrand", ".TRTown, .TRShoes").hide();
tr.nextUntil(".TRBrand", ".TRTown").find("a.TownToggle").text("+");
}
t.text(txt == "+" ? "-" : "+");
});
$(".TownToggle").click(function() {
var t = $(this);
var txt = t.text();
var tr = t.closest("tr");
if (txt == "+") {
tr.nextUntil(".TRBrand,.TRTown", ".TRShoes").show();
} else {
tr.nextUntil(".TRBrand,.TRTown", ".TRShoes").hide();
}
t.text(txt == "+" ? "-" : "+");
});
未正确定位
如果我理解您的要求，以下内容应该符合您的要求：http://jsfiddle.net/Sx4qg/69/
{{1}}