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

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});