jquery - 确定我点击的 div 中图像的索引

Question

我有一些像这样的代码:

<div id="thumbs">
    <img src="/media/img/banana.png" />
    <img src="/media/img/apple.png" />
    <img src="/media/img/lobster.png" />
    <img src="/media/img/charismatic_duck.png" />               
</div>

我想要的是弄清楚以下代码需要什么，以便如果我单击第一个图像，它会记录 1，如果我单击下一个图像，它会记录 2 等等。

$("#thumbs img").click(function(){
    console.log(_____WHAT GOES HERE?_____)
});

我知道我可以添加 ID(image1、image2 等)并使用它来解决问题，但如果有的话，我想要一种更简洁的方法。

Answer 1

console.log( $(this).index() + 1 )

.index() 方法返回被单击的 img 从零开始的索引号(相对于其同级)。

我添加了 + 1 来为您提供您想要的从 1 开始的索引。

• http://api.jquery.com/index/

还有多种其他方法可以调用.index()。如果没有参数，它的行为就像我上面描述的那样。