Comment obtenir l'index d'un élément parent dans jQuery

Question

J'ai des problèmes pour écrire une fonction jQuery et je pourrais avoir besoin d'un peu d'aide. Voici ce que j'aimerais accomplir:

J'ai un élément ul avec 5 li enfants. Ailleurs sur la page, j'ai un conteneur div avec 5 div enfants. Lorsque je clique sur un lien dans le troisième li, j'aimerais cacher les autres divs et montrer seulement le troisième.

Actuellement, chaque fois que je clique sur un lien dans l'un des li, il renvoie l'index de li dans tous les li sur la page, pas dans le ul contenant.

Voici mon code:

$('.products #productNav li a:not(.active)').live('click', function() { 
    var index = $(this).parent().index('li'); 
    alert(index); 
    $('.products #copy div').fadeOut(200,function() { 
     $('.products #copy div').eq(index).fadeIn(200); 
    }); 
}); 

Toutes les idées? Merci beaucoup.
Marcus

Answer 1

changement .index('li') à .index() il ne reçoit que le numéro d'index de sa position par rapport à ses frères et sœurs.

Voici un exemple simplifié:http://jsfiddle.net/cWWLM/

$('.products #productNav li a:not(.active)').live('click', function() { 

      // Get index of the parent <li> relative to its siblings 
    var index = $(this).parent().index(); 
    alert(index); 
    $('.products #copy div').fadeOut(200,function() { 
     $('.products #copy div').eq(index).fadeIn(200); 
    }); 
});