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

小编典典

javascript

假设我有这个标记：

<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”的。

阅读 509

2020-05-01

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

2020-05-01