为什么 jquery toggle() 不起作用？

Question

$(document).ready(function(){
   $('.a').click(function() {
    var index = $(this).index();
    $('.tablex').eq(index).toggle();
});
});

有 8 个 .a 和 8 个 .tablex。

<div class="a">X</div>
<div class="tablex">...</div>
<div class="a">X</div>
<div class="tablex">...</div>
<div class="a">X</div>
<div class="tablex">...</div>
...

当我点击 X 时只有第一个切换。当我单击第 2 个 div 时，第 4 个 tablex 切换。

为什么会这样？

我改成了这样：

$(document).ready(function(){
   $('.a').click(function() {
    $(this).next().toggle();
});
});

感谢 Josh Crazier。

Answer 1

它不起作用的原因是因为 $(this).index() 不只是计算具有相同 class 的其他元素。它正在获取该元素在其所有兄弟姐妹中的位置。所以当你点击第一个.a，index = 0；当您单击第二个 .a、index = 2 时，第三个是 index = 4，依此类推。

您可以使用 $(this).parent.find(".a").index(this) 获取它在其他 .a 元素中的索引。

但更简单的是

$(this).next().toggle();

为什么 jquery toggle() 不起作用？

Why jquery toggle() doesn't work?

jquery

toggle