4

これに関する投稿がたくさんあることは知っていますが、なぜ私の投稿が機能しないのかわかりません。

テーブル内の行を強調表示しようとしています:

<tr class="videorow"><td>...</td>...</tr>
...

CSS:

.highlight {
   background-color: #a8cb17;
}

そして最後に私のjQuery:

jQuery(document).on("click", ".videorow", function() {

    //highlight table
    jQuery(".highlight").removeClass("highlight");
    jQuery(this).addClass("highlight");
});

基本的に、行を強調表示し、新しい行が選択されたときにクリアしたいと考えています。これは私が理解することさえできない最初の部分です。

さらに、最後の列でハイライトをトリガーしたくないことを除いて、行全体をハイライトしたいと考えています。つまり、行の最後の列をクリックすることはできますが、ハイライトは変更されません。

何かのようなもの:

jQuery(document).on("click", ".videorow", function() {

    //highlight table
    jQuery(".highlight").removeClass("highlight");
    jQuery('table tr td:not(:last-child)').addClass("highlight");
});

これらの問題の両方に関するガイダンスをいただければ幸いです。

編集:入力が速すぎます。構文エラーは、コピーする代わりにこれを書き出すだけです...現在修正されています

4

4 に答える 4

5
jQuery(document).on("click", "tr.videorow > td", function() {
    var $this = jQuery(this);

    // ignore clicks on last column
    if ( $this.is(":last-child") ) return;

    // unhighlight currently selected row
    jQuery(".highlight").removeClass("highlight");

    // change the highlight of the row        
    $this.parent().addClass("highlight");
});
于 2013-05-07T03:26:27.317 に答える
0

あなたのコードでは、次のように書きました。

jQuery(table tr td:not(:last-child)).addClass("highlight");

構文エラーがあります。jQuery関数に渡されたパラメーターは ではありませんstring。これに変更しました:

jQuery('table tr td:not(:last-child)').addClass("highlight");
于 2013-05-07T03:06:40.400 に答える
0

行をクリックすると、次を使用します。

$('.row_selected').removeClass('row_selected');$(this).toggleClass('row_selected');
于 2014-04-01T08:53:36.693 に答える