Как получить индекс текущего элемента по отношению к родительскому элементу с помощью jQuery?

Question

Я пытаюсь получить индекс текущего элемента в пределах

<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>

Я использую jQuery и получаю сумму, просто используя

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

Как получить текущий индекс по отношению к родительскому элементу?

например. Третья ссылка нажата, 3 возвращается или 2, если в виде массива.

Я попробовал следующее, но продолжаю возвращать -1, если не найдено

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

РЕДАКТИРОВАТЬ: изменен ul.navbar в javascript на ul # navbar, извинения

Answer 1

Использование метода index() на родительском элементе li

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

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

Если аргумент методу .index () не передан,возвращаемое значение является целым числом, указывающим положение первого элемента в объекте jQuery относительно его родственных элементов.

Answer 2

Если у вас нет других якорей внутри панели навигации,

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

Если у вас есть вложенные якоря, как это обычно бывает в панелях навигации, это будет делать:

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

Answer 3

В вашем коде вы пытаетесь получить доступ к ul.navbar, но у ul нет класса с именем navbar. Чтобы получить доступ к нему по идентификатору, используйте селектор идентификаторов #

Кроме того, вам просто нужно использовать index () , который получает индекс текущего элемента по отношению к его братьям и сестрам. Используйте .parent () , чтобы получить li, а затем получите доступ к индексу этого.

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

Пример: http://jsfiddle.net/jonathon/SyvZ5/

Answer 4

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

должен сделать трюк.