通过Django temp中数据属性的数值切换元素

Question

我有一个组名列表，每个组名都有一个学生名列表。 我想在单击组名时显示每个组下的名称列表。在

例如

group 1(#clicked)     
    A 
    B
    C
group 2(#not clicked)
group 3(#clicked)
    F
    E
    R

我有两个模型

1:组（id、名称） 2： 学生（id、姓名、组号）

在HTML:-在

^{pr2}$

我想将组id作为属性发送，并使用它来只显示那些与组标识匹配的名称。 我的Html在每个组下给我正确的名称。我只想在点击组时切换它们名字。对吗现在它切换所有组下的所有名称。在

编辑： JAVASCRIPT代码：

nameDisplay = function () {
    $(".clickSpan").click(function () {
        $(".group-list").next('.name-list').toggle()
    });
}

clickSpan是我为每个组名添加的span类，它显示“click to exapnd”。我怎样才能达到同样的目标呢？ 也会更好，如果我可以得到“点击崩溃”这里，当它展开。在

Answer 1

您可以简单地使用^{}，或者其他方法来遍历，使用触发事件的元素，然后可以使用.toggle()方法

Get the immediately following sibling of each element in the set of matched elements. If a selector is provided, it retrieves the next sibling only if it matches that selector.

$(".group-list").click(function(){
    $(this).next(".name-list").toggle();
});

不需要附加属性。在

Answer 2

在标记中，group-list元素和必须切换的name-list是同级元素，因此可以利用该关系来切换正确的元素。在

不需要有其他属性来执行此操作。在

nameDisplay = function () {
    $(".name-list").hide();
    $(".group-list").click(function () {
        $(this).next('.name-list').toggle()
    });
}

---

另外，最好使用css规则来设置name-list的默认隐藏状态

^{pr2}$

然后单击处理程序使其可见

nameDisplay = function () {
    $(".group-list").click(function () {
        $(this).next('.name-list').toggle()
    });
}