jquery - 在包含许多元素的列表上使用 JQuery Slidetoggle()

Question

我想做一个人的列表，当点击 div 时，他们的时间表如下所示(我假设 slidetoggle() 方法在这里是最好的？)。

无论如何，我能找到的所有教程都是针对个别简单的事情。如果从许多名称中单击一个名称，那么下面只显示他们的时间表，我该怎么做？

我在这些线路上:

<div class="tutor">
<h2>Joe Bloggs</h2>
<img>(a dynamic arrow pointing up or down depending on the current toggle)</img>
    <div class="calendar">
        Calendar hide or show
    </div>
<div>  

我想这一切都围绕着 $this 关键字的使用，但我仍然不是 100% 确定如何使用它!

非常感谢，

瑞克

Answer 1

例子:

// Bind click event to all elements with the "tutor"-class
$(".tutor").click(function() { 
    // When one is clicked, call slideToggle on the div with class "calendar" it contains
    $(this).children(".calendar").slideToggle();
    // Toggle a class on the child img which specifies background-image/position
    $(this).children("img").toggleClass(".someClass");
});

希望这对您有所帮助:)