2 
<div class="views-row">
<div>
    <h5 class="product-name">
        <a href="#">Dots</a>
    </h5>  
</div>  
<div class="views-field">       
    <div class="field-content">
        <a href="#">
            <img alt="" src="#" />
        </a>
    </div>  
</div>

ここにjqueryがあります：

    $('.views-field').hover(function() {
    $('h5').css('text-decoration', 'underline');
}, function() {
    $('h5').css('text-decoration', 'none');
});

上記のコードが生成するのは、ホバリングしているアイテムだけでなく、すべてのクラス アイテムに対するホバー効果です。追加してみました

$(this).parent('views-row').find('h5').css('text-dec', 'under')

しかしそこには豆がありません。

ご想像のとおり、私はjQueryの初心者であり、正しい方向へのポイントを本当に感謝しています...

前もって感謝します

4

4 に答える 4

3

試す：

$('.views-field').hover(function() {
    $('h5', $(this).closest('.views-row')).css('text-decoration', 'underline');
}, function() {
    $('h5', $(this).closest('.views-row')).css('text-decoration', 'none');
});

次を使用することもできます:$(this).parents('.views-row')その特定の行にアタッチしますが、 closest1 つの要素のみを返します。

フィドル: http://jsfiddle.net/iambriansreed/Ct39b/

于 2012-04-25T14:26:24.613 に答える
1

試す$(this).prev().find('h5').css('text-decoration', 'underline');

h5を含むdivが常に上にある場合、上記は機能するはずです.views-field。

$('.views-field').hover(function() {
    $(this).prev().find('h5').css('text-decoration', 'underline');
}, function() {
    $(this).prev().find('h5').css('text-decoration', 'none');
});
于 2012-04-25T14:25:29.973 に答える
1

h5これを行う最も簡単な方法は、 を前の要素にスコープすることだと思います

$('.views-field').hover(function() {
    $('h5',$(this).prev()).css('text-decoration', 'underline');
}, function() {
    $('h5',$(this).prev()).css('text-decoration', 'none');
});

ここに実証するjsfiddleがあります：http://jsfiddle.net/v39UQ/

于 2012-04-25T14:36:04.617 に答える
-1

こちらの例をご覧ください

コードは次のとおりです。

<div class="views-row">
<div>
    <h5 class="product-name">
        <a href="#">Dots</a>
    </h5>  
</div>  
<div class="views-field">       
    <div class="field-content">
        <a href="#">
            <img alt="" src="#" />
        </a>
    </div>  
</div>​

$('.views-row h5').hover(function() {
        $(this).css('text-decoration', 'underline');
    }, function() {
        $(this).css('text-decoration', 'none');
    });​

上記のコードに純粋なcssを使用して実行できる情報は、以下のコードを参照してください。

.views-row h5:hover{
    text-decoration: underline;
}
于 2012-04-25T14:39:20.270 に答える