动态创建列表Javascript的索引

Index of a dynamic created list Javascript

本文关键字：索引 Javascript 列表 创建 动态      更新时间：2023-09-26

我有一个动态创建的列表，其中包含json数据。所以我的问题是如何获得点击项目的索引。

我试过这个：

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

但这并没有奏效。我没有收到警报？如果我创建一些静态的Li元素，我会得到它们的索引。

请帮助我：/

动态创建的列表将需要委派事件。。。

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

如果<ul>也是动态创建的，请选择创建列表之前存在的父节点。

两个问题：

  1. 你只需要$(this).index():

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

    来自文件：

    如果没有参数传递给.index()方法，则返回值是一个整数，指示jQuery对象中第一个元素相对于其同级元素的位置。

  2. 当您执行$("li").click(...)时，它会将其连接到该时间点存在的元素。稍后添加的按钮不会得到分配给它们的点击处理程序。处理这样的动态列表的最佳方法通常是事件委派。DevlshOne在他的/她的回答中给你一个例子。基本思想是：

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

    它将click挂接在列表上，而不是列表项上，但当单击发生时会触发处理程序，就像您在处理程序上挂接了单击一样。

尝试以下操作。假设CCD_ 6不是动态加载的。

$("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

这是

$("li").click(function() {
       var index = $(this).index();
       alert(index);
});
相关文章：