获取事件目标的父元素的索引

Question

使用此代码提供:

$("#myList").on("click", "span", function (event) {
    alert($(this).index());
});

和HTML:

<ul id="myList">
    <li>item 0 <span>span 0</span></li>
    <li>item 1 <span>span 1</span></li>
    <li>item 2 <span>span 2</span></li>
    <li>item 3 <span>span 3</span></li>
</ul>

如果单击任何<span>元素,将始终提醒"0".我认为这是因为<span>每个内部只有一个<li>,所以它总是被赋予0的索引.

我希望它做的,就是返回的索引<span>的母公司-在这种情况下,这将是父母的指标<li>内<ul id="myList">.例如,单击<span>span 2</span>将提示"2".

的jsfiddle

Answer 1

要么使用$(this).parent().index()或$(this).closest('li').index().

即使你决定在你的跨度中添加一个新元素并将事件绑定到那个,后者也会提醒li的索引.