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时，只有第一个切换。当我点击第二个div时，第四个tablex切换。

为什么会发生这种情况？

我把它更改为：

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

感谢Josh Crazier。

Answer 1

它不起作用的原因是因为$(this).index()并不仅仅计算具有相同类别的其他元素。它在所有兄弟姐妹中获得元素的位置。因此，当您点击第一个.a时，index = 0;当您点击第二个.a，index = 2时，第三个是index = 4，依此类推。

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

但更简单就是

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

为什么jquery toggle（）不起作用？

1 个答案: