使用 jQuery 获取集合中单击元素的索引

如何在下面的代码中获得单击项的索引?

$('selector').click(function (event) {
// get index in collection of the clicked item ...
});

通过 Firebug 我看到了这个: jQuery151017197709735298827: 2(我已经点击了第二个元素)。

118347 次浏览

这将通知所单击选择器的索引(第一个选择器从0开始) :

$('selector').click(function(){
alert( $('selector').index(this) );
});
$('selector').click(function (event) {
alert($(this).index());
});

Jsfiddle

只要这样做:-

$('ul li').on('click', function(e) {
alert($(this).index());
});

或者

$('ul li').click(function() {
alert($(this).index());
});

兄弟姐妹

如果单击的元素是兄弟元素,则可以使用 $(this).index()来获取该元素的索引。

<div id="container">
<a href="#" class="link">1</a>
<a href="#" class="link">2</a>
<a href="#" class="link">3</a>
<a href="#" class="link">4</a>
</div>

$('#container').on('click', 'a', function() {
console.log($(this).index());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<div id="container">
<a href="#" class="link">1</a>
<a href="#" class="link">2</a>
<a href="#" class="link">3</a>
<a href="#" class="link">4</a>
</div>


不是兄弟姐妹

如果没有参数传递给 .index()方法,返回值是一个整数,指示 jQuery 对象 相对于它的兄弟元素中第一个元素的位置。

将选择器传递给 index(selector)

$(this).index(selector);

例如:

查找单击的 <a>元素的索引。

<tr>
<td><a href="#" class="adwa">0001</a></td>
</tr>
<tr>
<td><a href="#" class="adwa">0002</a></td>
</tr>
<tr>
<td><a href="#" class="adwa">0003</a></td>
</tr>
<tr>
<td><a href="#" class="adwa">0004</a></td>
</tr>

小提琴

$('#table').on('click', '.adwa', function() {
console.log($(this).index(".adwa"));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<table id="table">
<thead>
<tr>
<th>vendor id</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="#" class="adwa">0001</a></td>
</tr>
<tr>
<td><a href="#" class="adwa">0002</a></td>
</tr>
<tr>
<td><a href="#" class="adwa">0003</a></td>
</tr>
<tr>
<td><a href="#" class="adwa">0004</a></td>
</tr>
</tbody>
</table>

如果你正在使用.bind (this) ,试试这个:

let index = Array.from(evt.target.parentElement.children).indexOf(evt.target);

$(this.pagination).find("a").on('click', function(evt) {
let index = Array.from(evt.target.parentElement.children).indexOf(evt.target);


this.goTo(index);
}.bind(this))

看看这个 Https://forum.jquery.com/topic/get-index-of-same-class-element-on-click 那么 Http://jsfiddle.net/me2loveit2/d6rfm/2/

var index = $('selector').index(this);
console.log(index)