filtro () Comportamento estranho sobre uma mesa

votos
47

Alguém por favor pode olhar para a minha demo e me diga por que meu celular não está sendo destacado?

$(#tbl td.rank).filter(function () {
    return $(this).text() > 30;
}).addClass('bright');

http://jsfiddle.net/qmftvxyd/6/

Basicamente, eu quero destacar a célula cujo grau> 30

Update: Mudou ligação demonstração de classe tinham sido indevidamente mencionado

Publicado 10/11/2014 em 05:06
usuário
Em outras línguas...                            


3 respostas

votos
2

Você tem alguns erros:

1) O seletor é errado. Você pode adicionar tr(opcional) e também não há td com classe.rank

2) Para comparar texto de cada tdvocê tem primeiro a converter para um número usando parseInt .

$("#tbl tr td.age").filter(function() {
  return parseInt($(this).text(), 10) > 30;
}).addClass('bright');
.bright {
  color: red !important;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="tbl">
  <thead>
    <tr>
      <th class="id">EmpNo</th>
      <th class="name">First Name</th>
      <th class="rank">Rank</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td class="id">E342</td>
      <td class="name">Bill</td>
      <td class="age">35</td>
    </tr>
    <tr>
      <td class="id">E343</td>
      <td class="name">Laura</td>
      <td class="age">26</td>
    </tr>
  </tbody>
</table>

Respondeu 10/11/2014 em 05:10
fonte usuário

votos
0

Você está usando classe errada para filtrar. Você deve usar td.age. DEMONSTRA

 $("#tbl td.rank").filter(function () {
     return parseInt($(this).text(),10) > 30;
  }).addClass('bright');
Respondeu 10/11/2014 em 05:11
fonte usuário

votos
1

Eu acho que você só precisa converter o posto de verificação para um número inteiro de modo que o valor poderia ser comparado. tentar mudar a cor de texto de harmonização TD para outra coisa como o vermelho para notar o efeito. tente o seguinte:

$("#tbl td.rank").filter(function () {
    return parseInt($(this).text()) > 30;
}).addClass('bright');

programa demonstrativo

Respondeu 10/11/2014 em 05:30
fonte usuário

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more