TD的jQuery条件选择器



我希望能够将类添加到TR元素,取决于第一个TD元素的值。

例如:

如果我有以下数据阵列:

[1,2,3,4][5,6,7,8]

每个数组代表一个TR,每个元素是TD,我想突出显示第一个TD等于5的TR。

我该怎么做?

谢谢,

以下示例可以帮助!

$(function() {
  var tr = $('tr').find('td:first-child');
  tr.each(function() {
    if ($(this).text() == 5)
      $(this).parent('tr').addClass('highlight');
  });
});
tr.highlight {
  background-color: yellow;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
  </tr>
  <tr>
    <td>5</td>
    <td>6</td>
    <td>7</td>
    <td>8</td>
  </tr>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
  </tr>
  <tr>
    <td>5</td>
    <td>6</td>
    <td>7</td>
    <td>8</td>
  </tr>
</table>

我通过使用fnrowcallback函数来解决此问题

'fnRowCallback': function(nRow, aData, iDisplayIndex) {
  $(nRow).css('cursor', 'pointer');
  $(nRow).prop('title', 'Select Company');
  if (aData.CompId === "COMP01") {
    $(nRow).find('td').addClass('selectedCompany');
  }
  return nRow;
},

您可以将first-child:contains与jquery

一起使用

$('td:first-child:contains("5")').parent('tr').addClass('selected')
tr.selected {
  background: yellow;
}
tr.selected td:first-child {
  font-size: 1.5em;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
  </tr>
  <tr>
    <td>5</td>
    <td>6</td>
    <td>7</td>
  </tr>
  <tr>
    <td>1</td>
    <td>5</td>
    <td>7</td>
  </tr>
</table>

编辑注释:: 这将在字符串

上选择所有第一个TD使用5

假设所需的行TD的内容为"两个",其中任何一个都可以工作:

$(document).ready(function() {
  var findMe = "two";
  $('#mytable').find('tr').filter(function(index) {
    var isTwo = $(this).find('td').eq(0).text() === findMe;
    return isTwo;
  }).addClass('highlight');
  $('#mytable').find('tr').find('td:first').filter(':contains("' + findMe + '")').parent('tr').addClass('highlight');
});

最新更新