CODEWITHSUNDEEP
jqueryhtml
Michael
Michael

Reputation: 53

jQuery returning the number (eq) of a clicked div

So I'm building a jQuery plugin for a project that allows the client to create multiple jQuery scrollers per page -- I'm focusing strictly on the front end for this question.

On document ready, it will tell the slider div to initialize. This then takes the number of images in the slider, and creates a little circle button for each image so a user could click a circle and slide directly to the corresponding image.

I'm looking for something that will return the .eq() value of that circle in order to know which slide they're trying to get to. $(this).eq() does not work.

Upvotes: 4

Views: 6735

Answers (3)

Mike Robinson
Mike Robinson

Reputation: 25159

To extend on Patrick's answer, you can use index with a collection for more granularity.

Something like:

var collection = $("div.slider").find("img");
$("div.slider img").click(function() {
 var index = $(collection).index(this);
});

Upvotes: 0

Nick Craver
Nick Craver

Reputation: 630549

To get the index, use .index() like this:

$("#content > div").click(function() {
   alert($(this).index());
});

If they're not next to each other, use this:

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

.index() returns the 0-based index, just like you'd pass to .eq(). Your question does raise an interesting point though, why doesn't .eq() without arguments return the index...

Upvotes: 1

user113716
user113716

Reputation: 322532

If the elements are siblings, you could do this:

var index = $(this).index();

If not, you can pass a selector of the set in which to look for the element.

var index = $(this).index('someSelector');

Just place the proper one of these inside your click handler.

Upvotes: 10

Related Questions