How do I get the index of clicked item in the code below?
$('selector').click(function (event) {
// get index in collection of the clicked item ...
});
With Firebug I saw this: jQuery151017197709735298827: 2
(I've clicked in the second element).
This will alert the index of the clicked selector (starting with 0 for the first):
$('selector').click(function(){
alert( $('selector').index(this) );
});
$('selector').click(function (event) {
alert($(this).index());
});
$(this).index()
can be used to get the index of the clicked element if the elements are siblings.
<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>
If no argument is passed to the
.index()
method, the return value is an integer indicating the position of the first element within the jQuery object relative to its sibling elements .
Pass the selector to the index(selector)
.
$(this).index(selector);
Example:
Find the index of the <a>
element that is clicked.
<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>
Just do this way:-
$('ul li').on('click', function(e) {
alert($(this).index());
});
OR
$('ul li').click(function() {
alert($(this).index());
});
check this out https://forum.jquery.com/topic/get-index-of-same-class-element-on-click then http://jsfiddle.net/me2loveit2/d6rFM/2/
var index = $('selector').index(this);
console.log(index)
if you are using .bind(this), try 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))
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.