0

ゼブラ ストライプ (奇数行ごとに異なる背景色) のテーブルがあります。行の編集後にjQueryが提供するハイライト効果（背景色を3秒間変化させる）を適用します。白い行 (背景色なし) でのみ機能します。

ここに画像の説明を入力

ここに画像の説明を入力

このハイライト効果を任意の行に適用できる可能性はありますか?

JavaScript ファイルのコードは次のとおりです。

$('#MyRowToHighlight').effect("highlight", {}, 1500);

これが私のテーブルの頭です：

<table class="zebra-striped">
    <thead>
        <tr>
            <th>Company</th>
            <th>Username</th>
            ...

ゼブラ ストライプの CSS は次のとおりです。

.zebra-striped tbody tr:nth-child(odd) td{background-color:#f9f9f9;}
.zebra-striped tbody tr:hover td{background-color:#f5f5f5;}

ありがとう。

4

1 に答える 1

1

セレクターがであることに基づいて、あなたが示した限られたhtmlとJSからの私の推測"#MyRowToHighlight"では、ハイライト効果は行レベル、つまりtrに適用されていますが、スタイルシートは奇数行に背景色を適用していますセルレベルで、つまりtdsに。trスタイルはtdスタイルによって打ち負かされます。私がここで正しい方向に進んでいると仮定すると、ハイライトが偶数行で機能する理由は、tdsにスタイルがないためです。

したがって、次の行のセレクターを変更してみてください。

$('#MyRowToHighlight').effect("highlight", {}, 1500);

行のtdsに効果を適用するには：

$('#MyRowToHighlight td').effect("highlight", {}, 1500);
于 2012-04-07T10:22:33.603 に答える