Question

给出以下HTML：

<ul>
    <li class="imgThumbLi">
        <img src="larry.jpg"/>
    </li>
    <li class="imgThumbLi">
        <img src="curly.jpg"/>
    </li>
    <li class="imgThumbLi">
        <img src="moe.jpg"/>
    </li>
</ul>

然后，当有人将鼠标悬停在其中一个<img>元素上时，我会处理一些jQuery：

$(".imgThumbLi").live({
    mouseenter:
        function() {
            // Obtain the source of the current image we're hovering over.
            var src = $(this).children('img')[0].src;

            // Now I need to know which <li> the "current" (one we're hovering
            // over) image's parent <li> we're in, as a zero-based  index
            // of the <ul>.
            var currListElementIndex = ????
        }
    }
);

因此，如果用户将鼠标悬停在larry.jpg上，则currListElementIndex的值将为0。如果他们将鼠标悬停在moe.jpg上，那么该值将为2等。先谢谢！

编辑：由于其他一些限制，我无法向<li>元素添加ID或执行其他任何明显的操作...我需要获取{{以某种方式（可能通过父函数??）并找出我所在的<ul>的哪个索引。

Answer 1

由于live函数应用于“li”，你可以使用$（this）.index（）来获取索引.So

var currListElementIndex = $(this).index()返回索引

Answer 2

$(".imgThumbLi").live({
    mouseenter:
        function() {          
            var item=$(this);
            var src = $(this).children('img')[0].src;
            var currListElementIndex = item.index();
            alert(currListElementIndex);
        }
    }
);

jQuery：如何获取列表元素的索引

2 个答案: