Question

我有这个脚本在点击时更改background-color表格tr：

<script>
  $('#reviews').on('click', 'tbody tr', function(event) {
    $(this).addClass('highlight').siblings().removeClass('highlight');
  })
</script>

工作正常。不过，我想排除td的第一个tr。因此，当用户点击第一个td时，没有任何反应。如何排除它？

试过这个：

<script>
  $('#reviews').on('click', 'tbody tr:not(:first-of-type)', function(event) {
    $(this).addClass('highlight').siblings().removeClass('highlight');
  })
</script>

但点击第一个td时，它仍会突出显示整行。

Answer 1

你试图排除第一个tr，但提到你想要先排除。

试试这个

import {PolymerElement, html} from "../node_modules/@polymer/polymer/polymer-element.js";
import "../node_modules/@polymer/polymer/lib/elements/dom-if.js";
import "../node_modules/@polymer/app-route/app-location.js";
import "../node_modules/@polymer/app-route/app-route.js";

Answer 2

您排除每行的第一个tr而不是td。如果我正确理解你的目标，它应该是这样的：

  $('#reviews').on('click', 'tbody tr td:not( :first-of-type )', function(event) {
    $(this).parent().addClass('highlight').siblings().removeClass('highlight');
  })

Demo link

如何在选择tr时排除第一个td？ CSS，JQuery

2 个答案: