Wie bekomme ich den Index des aktuellen Elements in Bezug auf das übergeordnete Element mit jQuery?

Question

Ich versuche, den Index des aktuellen Elements innerhalb

<ul id="navbar"> 
    <li><a href="#a">Link</a></li> 
    <li><a href="#b">Link</a></li> 
    <li><a href="#c">Link</a></li> 
    <li><a href="#d">Link</a></li> 
    <li><a href="#e">Link</a></li> 
</ul> 

Ich bin mit jQuery und die Gesamt bekam, indem einfach

$('ul#navbar').children().length; 

Wie kann ich den aktuellen Index in Beziehung erhalten haben zu bekommen das Elternelement?

z. Der dritte Link wird angeklickt, 3 wird zurückgegeben oder 2 wenn als Array.

Ich habe folgendes aber halten versucht -1 Rückkehr für nicht gefunden

$('ul#navbar a').click(function(){ 
    var curPos = $(this).parent().parent().index($(this).parent()); 
}); 

EDIT: auf Entschuldigungen Changed die ul.navbar im Javascript # navbar UL,

Answer 1

Mit dem index() Methode das Mutterelement li

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

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

Wenn an die Methode .index() kein Argument übergeben wird, ist der Rückgabewert eine Ganzzahl, die die Position des ersten Elements innerhalb des jQuery-Objekts relativ zu seinen gleichgeordneten Elementen angibt.

Answer 2

$(function() { 
    $('ul#navbar a').click(function(){ 
     var curPos = $(this).parent().index(); 
    }); 
}); 

sollte es tun.

Answer 3

In Ihrem Code versuchen Sie, auf ul.navbar zuzugreifen, aber die ul hat keine Klasse mit dem Namen navbar. Um nach ID zu suchen, verwenden Sie den ID-Selektor

Außerdem müssen Sie nur index() verwenden, die den Index des aktuellen Elements in Bezug auf seine Geschwister erhält. Verwenden Sie die .parent(), um die li zu erhalten, und greifen Sie dann auf den Index davon zu.

$('ul#navbar a').click(function(){ 
    var curPos = $(this).parent().index(); 
    console.log(curPos); 
}); 

Beispiel: http://jsfiddle.net/jonathon/SyvZ5/

Answer 4

Wenn Sie keine andere Anker in der Navigationsleiste haben,

$('#navbar a').click(function() { 
    var curpos = $('#navbar a').index(this); 
}); 

Wenn Sie Anker verschachtelt sind, wie in NavBars üblich sind, wird dies tun:

$('#navbar>li>a').click(function() { 
    var curpos = $('#navbar>li>a').index(this); 
});