jquery - jquery动画切换不起作用

Question

<div>
    <a href="#" class="click">Click1</a>
</div>
<div class='classshow'>Toggle Text1</div>
<div>
    <a href="#" class="click">Click2</a>
</div>
<div class='classshow'>Toggle Text1</div>

我的 Javastipt 代码：

$(".click").click(function () {
    $(".classshow").slideToggle("slow");
})

在这个实现中，问题是所有 div 都在切换，我只想在 div 旁边切换。请帮忙

Answer 1

那是因为您正在选择所有具有 class 的元素.show。尝试以下操作：

$(".click").click(function() { 
   $(this).parent().next('.classshow').slideToggle("slow"); 
})

小提琴

您还可以使用href锚链接的属性来选择元素。

<div>
    <a href="#first" class="click">Click1</a>
</div>
<div class='classshow' id='first'>Toggle Text1</div>
<div>
    <a href="#second" class="click">Click2</a>
</div>
<div class='classshow' id='second'>Toggle Text1</div>

$('.click').click(function(e){
  e.preventDefault(); // prevents the default action of the event.
  $(this.href).slideToggle();
})