1

スパンテキストがホバーで表示されるようにクラスを追加しようとしていますが、その特定の画像についてのみ、一度にすべての画像が表示されるわけではありません。

一度にすべてのスパンにクラスを追加するように取得できますが、ホバーされているスパンのみに制限しようとすると、何も起こりません。問題は、.next（'span'）を追加したときのようです-理由はわかりませんが。

誰かが私がここで間違っていることを教えてもらえますか？

    $('.scroller-image').hover(function() {

         $(this).next('span').addClass('hover');
         }, function() {
         $(this).next('span').removeClass('hover');

    });

マークアップは次のとおりです。

<div class="scroller-image">
    <span>image title</span>
    <img src="#" alt="#" />
</div>
4

5 に答える 5

9

next（）は、子要素ではなく、次の兄弟を選択します。あなたが欲しいのはこの children（）です

$(this).children('span')// <-- this find direct children spans

またはfind（）

$(this).find('span')  //<-- this finds all descendent spans
于 2012-07-30T16:12:58.340 に答える
3

.next()子供ではなく兄弟を検索します。試す$(this).children('span')

于 2012-07-30T16:13:21.903 に答える
1

そのためにJavaScriptは必要ありません。CSSはこれを行うことができます：

.scroller-image:hover span {
    /* the styles from your .hover class */
}

ライブデモ： http： //jsfiddle.net/VbZ2G/

于 2012-07-30T16:18:15.317 に答える
1

を使用して、セレクターのコンテキストとして.toggleClass()提供することにより、コードを少し短縮できます。thisこのような：

$('.scroller-image').hover(function(e) {
    $('span', this).toggleClass('hover', e.type === "mouseenter");
});
于 2012-07-30T16:13:46.420 に答える
0

ホバーされている div の子であるスパンに「ホバー」クラスを追加しようとしていますか? 私.next()は兄弟に行くと思います、試してみませんか

.children('span')
于 2012-07-30T16:14:30.360 に答える