用jquery突出显示表行

Tom*_*Tom 2 css jquery

我知道这里有很多帖子,但我迷失了为什么我的工作不起作用.

我正想在表格中突出显示一行:

<tr class="videorow"><td>...</td>...</tr>
...
Run Code Online (Sandbox Code Playgroud)

CSS:

.highlight {
   background-color: #a8cb17;
}
Run Code Online (Sandbox Code Playgroud)

最后我的jQuery:

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

    //highlight table
    jQuery(".highlight").removeClass("highlight");
    jQuery(this).addClass("highlight");
});
Run Code Online (Sandbox Code Playgroud)

基本上我想突出显示一行,并在选择新行时清除.这是我无法弄清楚的第一部分.

另外我想突出整行,除了我不希望最后一列触发高亮显示.换句话说,您可以单击该行的最后一列,但不会更改突出显示.

就像是:

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

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

对这两个问题的任何指导都表示赞赏.

编辑:输入太快.语法错误只是我写出来而不是复制...现在修复

nbr*_*oks 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");
});
Run Code Online (Sandbox Code Playgroud)