获取元素的索引作为相对于父级的子级

Question

获取元素的索引作为相对于父级的子级假设我有这个标记：<ul id="wizard">     <li>Step 1</li>     <li>Step 2</li></ul>我有这个jQuery：$("#wizard li").click(function () {     // alert index of li relative to ul parent});li单击该项时，如何获取相对于其父项的子项索引li？例如，当您单击“步骤1”时，将alert弹出一个“0”。

Answer 1

$("#wizard li").click(function () {
    console.log( $(this).index() );});

但是，不是为每个列表项附加一个单击处理程序，更好（性能明智）使用delegate它看起来像这样：

$("#wizard").delegate('li', 'click', function () {
    console.log( $(this).index() );});

在jQuery 1.7+中，您应该使用on。下面的示例将事件绑定到#wizard元素，就像委托事件一样：

$("#wizard").on("click", "li", function() {
    console.log( $(this).index() );});

Answer 2

就像是：

$("ul#wizard li").click(function () {
  var index = $("ul#wizard li").index(this);
  alert("index is: " + index)});

Answer 3

看看这个例子。

$("#wizard li").click(function () {
    alert($(this).index()); // alert index of li relative to ul parent});