4 
<table border=2>
    <tr class="here1 yes">
        <td>aaa1</td><td>bbb1</td>
    </tr>
    <tr class="here2 yes">
        <td>aaa2</td><td>bbb2</td>
    </tr>

    <tr class="here55 yes">
        <td>aaa3</td><td>bbb3</td>
    </tr>
</table>


<table border=2>
    <tr class="here1 yes">
        <td>ccc1</td><td>ddd1</td>
    </tr>
    <tr class="here2 yes">
        <td>ccc2</td><td>ddd2</td>
    </tr>

    <tr class="here55 yes">
        <td>ccc3</td><td>ddd3</td>
    </tr>
</table>


.yes:hover {
   background-color: red;
}

ライブ： http： //jsfiddle.net/KzzW8/

上記の表は、次のPHPで生成されます。

 `<tr class="here<? echo $i ?> yes">`

部下がグルー​​プ内にある場合は、マウスオーバーTR.here1をオンにして、anyの内容TR.here1をREDにTD変更します：（aaa1、bbb1、ccc1、ddd1）どのテーブルにあるかに関係なく。

これにはjQueryを使用できると思います。これは可能ですか？

4

1 に答える 1

5

http://jsfiddle.net/KzzW8/1/

$('tr').hover(function() {
    var cls = $(this).prop('class').match(/here\d+/);
    if (cls) {
        $('.' + cls).addClass('hover');
    }
}, function() {
    $('.yes.hover').removeClass('hover');
});​

したがって、ホバーイベントでクラスを取得し、同じクラスのすべての行にhere*クラスを適用します。.hoverホバーアウト時に-追加で追加されたクラスをすべて削除します

于 2012-06-12T23:32:44.647 に答える