Индекс динамически созданного списка Javascript

Question

У меня есть динамически созданный список с данными json. Итак, мой вопрос в том, как получить индекс щелкнутого элемента.

Я попытался это:

$("li").click(function() { 
     var index = $("li").index(this); 
     alert(index); }); 

Но это не работало. Я не получаю предупреждение? Если я создаю некоторые статические элементы Li, я получаю их индекс.

Пожалуйста, помогите мне:/

Answer 1

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

$("ul").on("click", "li", function() { 
     var index = $(this).index(); 
     alert(index); 
}); 

Если <ul> также создаются динамически, пожалуйста, выберите родительский узел, который существует до того, как список будет создан.

Answer 2

Это

$("li").click(function() { 
     var index = $(this).index(); 
     alert(index); 
}); 

Answer 3

Два вопроса:

1. Вы просто хотите $(this).index():

   $("li").click(function() { 
       var index = $(this).index(); 
       alert(index); }); 
   

   От the documentation:

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

2. Когда вы $("li").click(...), перехватывает его на элементы, которые существуют в данный момент времени. Добавленные вами позже не получат назначенный им обработчик кликов. Лучший способ приблизиться к динамическим спискам, как это, обычно делегирование событий. DevlshOne дает вам пример in his/her answer. Основная идея заключается в следующем:

   $("selector for the list, not the list items").on("click", "li", function() { 
       // handler code here 
   }); 
   

   Это крючки click на списке, а не элементы списка, а затем запускает обработчик, когда щелчок происходит, как если бы вы имели крючковатый нажмите на обработчик.

Answer 4

Попробуйте следующее. что ul не загружается динамически.

$("ul.containerclass").on("click", "li", function() 
{ 
    var index = $(this).index(); 
    alert(index); 
}); 

или

$(document).on("click", ".containerclass li", function() { 
    var index = $(this).index(); 
    alert(index); 
}); 

Примечание: здесь containerclass может быть ID