Как узнать индекс текущего элемента ul li?


#1

Нужно срочно как то определять порядковый элемент списка, никак не получаеться определить почему то, вот старый скрипт:


$(
"li").click(function() {
var index = $(this).parent().children().index(this);
alert("You clicked item " index);
});

Взял на каком то сайте, показывает постоянно почему то -1, когда меняю что то то 0,

Был бы очень благодарен если бы кто то подсказал бы действующий метод.


#2

Вообще ваш вариант выглядит правильным, но это немного костыльно, так как вы сначала находите родительский элемент, а затем у него ищете ребенка с индексом изначально кликнутого элемента, в общем я бы сделал так:

Css для наглядности и хорошей видимости всех блоков:

ul {
background-color: #34648a;
}


ul li {
background-color: #76c8ff;
padding: 10px;
list-style-type: none;
}

В html создаем список из 9 элементов, все наполняем их позицией по массиву, то есть от 0 до 8, суммарно 9 )


el - 0
  • el - 1
  • el - 2
  • el - 3
  • el - 4
  • el - 5
  • el - 6
  • el - 7
  • el - 8
  • В последнем блоке, с помощью jquery мы выбираем все элементы списка в переменную, а далее просто при клике на список и на элемент в частности мы будем в временную переменную закладывать значение которое получим при вызове метода index передав в параметр this на переменной которая содержит всё множество элементов списка – all_elems. Ну и выводим в консоль значение.

    var all_elems = $('ul li');

    $('ul').on('click', 'li', function () {
    var temp= all_elems.index(this);
    console.log(temp);
    });