javascript - ターゲットと同じ親の要素を選択する

Question

私が以下のセットアップを持っていると仮定します：

<ul id="cal">
    <li><span>test</span><img /></li>
    <li><span>test</span><img /></li>
    <li><span>test</span><img /></li>
</ul>

そしてjQueryで：

$('#cal li span').hover(function(){
    $("#cal li img").trigger('mouseover');
});

#cal li img でマウスオーバーをトリガーする必要がありますが、すべての画像ではなくスパンの画像のみで

Answer 1

<img>次を使用して$(this).next()、または次の方法で最も近いものを参照できます。

$("#cal li span").hover(function() {
    $(this).siblings("img").trigger("mouseover");
});

Answer 2

次を使用して、コンテキストにリンクされていることを指定します。

$('#cal li span').hover(function(){
    $(this).parent().find("img").trigger('mouseover');
});

Answer 3

$('#cal li span').hover(function(){
    $(this).next("img").trigger('mouseover');
});