3

Eu possuo algumas tr na table que contem a classe tr-child e gostaria de modificar a cor delas quando o valor da quarta coluna dessa tr fosse > 0. Isso é possível de fazer com jquery ?

já havia feito algo...

$('.tr-child td:nth-child(4)').each(function(index, element){
if(element.innerHTML > 0){
// precisaria setar a tr referente a esta td aqui <--
}
});

2 Respostas 2

2

Veja o exemplo utilizando a função find()

Dica: Ao invés de usar o innerHTML do JavaScript, utilize o html() do jQuery, você poderá ter problemas em alguns navegadores utilizando o innerHTML já o html() irá instanciar a função do JavaScript após algumas verificações.

$('table tr').each(function() {
  var valor = parseInt($(this).find('td:nth-child(3)').html());
  if (valor > 60)
    $(this).addClass('colorido');
});
.colorido {
  background: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table style="width:100%">
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
</table>

1
  • 1
    Muito interessante sua dica, não sabia disso... Obrigada pela ajuda, foi semelhante ao que eu já havia feito, porém mais simples e eficiente.
    – Carlinhos
    Commented 11/02/2016 às 12:32
0

Após criar a pergunta fiz uma pesquisa rápida e consegui resolver o problema utilizando o metodo closest() do jquery, ficando assim:

$('.tr-child td:nth-child(4)').each(function(index, element){
  if(element.innerHTML > 0){
    $(element).closest('tr').attr('id','colorir');
  }
});
#colorir td{
  color:green;
}

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .