次の 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>
関数を介して??) を取得し、そのインデックスを把握する必要があります。私は入る。<ul>