jSélecteurs de recherche pour les lignes paires/impaires dans un tableau

Le code du premier bloc de code est le code source. Après le code source est en cours d'exécution. Le code sera changé (Voir le 2ème bloc de code).jSélecteurs de recherche pour les lignes paires/impaires dans un tableau

Je souhaite que la classe (c'est-à-dire 'pair' et 'impair') de la balise soit uniquement affichée dans la 'table1'. Cependant, actuellement, une table de nidification (c'est-à-dire 'table2') a également une classe "paire" et "paire" de chaque étiquette.

Quelqu'un peut-il m'aider? Merci d'avance.

----------- premier bloc de code --------------

<head> 
<script type="text/javascript"> 
      $(document).ready(function(){ 
       $("#table1 tr:odd").addClass("odd"); 
       $("#table1 tr:not(.odd)").addClass("even"); 
      }); 
</script> 
</head> 

<body> 

<table id="table1"> 
    <tr> 
     <td>AAA</td> 
     <td>CCC</td> 
    </tr> 
    <tr> 
     <td>BBB</td> 
     <td>DDD</td> 
    </tr> 
    <tr> 
     <td> 
      <table id="table2"> 
        <tr></tr> 
        <tr></tr> 
      <table> 
     </td> 
    </tr> 

</table> 
</body>

-------- --- 2e bloc de code ---------------

<table id="table1"> 
    <tr class="even"> 
     <td>AAA</td> 
     <td>CCC</td> 
    </tr> 
    <tr class="odd"> 
     <td>BBB</td> 
     <td>DDD</td> 
    </tr> 
    <tr class="even"> 
     <td> 
      <table id="table2"> 
        <tr class="even"></tr> 
        <tr class="odd"></tr> 
      <table> 
     </td> 
    </tr> 

</table>

Source

2011-07-12 Acubi

Vous devez donner à votre question un titre plus significatif. –

Toutes les réponses sont affichées presque droite ..

$(document).ready(function(){ 
    $("#table1 > tbody > tr:odd").addClass("odd"); 
    $("#table1 > tbody > tr:not(.odd)").addClass("even"); 
});

De nombreux navigateurs ajoutent automatiquement un tbody à votre table, même si vous n'ajoutez pas vous-même. Donc, #table1 > tr ne correspondra pas car tr n'est pas un enfant direct de table. Votre meilleur pari est d'utiliser ce qui précède et d'ajouter explicitement un tbody pour les navigateurs qui ne le font pas pour vous.

<table id="table1"> 
     <tbody> 
     <tr class="even"> 
      <td>AAA</td> 
      <td>CCC</td> 
     </tr> 
     <tr class="odd"> 
      <td>BBB</td> 
      <td>DDD</td> 
     </tr> 
     <tr class="even"> 
      <td> 
       <table id="table2"> 
        <tbody> 
         <tr class="even"></tr> 
         <tr class="odd"></tr> 
        </tbody> 
       <table> 
      </td> 
     </tr> 
     <tbody> 

</table>

http://jsfiddle.net/5ETAD/1/

Source

2011-07-12 14:44:54

Il devrait être:

$("#table1>tr:odd").addClass("odd"); 
$("#table1>tr:not(.odd)").addClass("even");

Source

2011-07-12 14:34:49

Cela ne fonctionnera pas: http://jsfiddle.net/5ETAD/2/ testé en chrome et IE8 et il ne correspond à rien. Les navigateurs ajoutent en interne un 'tbody'. –

Vous pouvez utiliser les éléments suivants (notez le signe supérieur à):

 $(document).ready(function(){ 
      $("#table1 > tr:odd").addClass("odd"); 
      $("#table1 > tr:not(.odd)").addClass("even"); 
     });

Ceci sélectionnera uniquement les enfants tr les plus proches.

Source

2011-07-12 14:34:56

-1

Utilisez le sélecteur direct child.

vous pouvez également utiliser: même au lieu de: non (.odd)

$(document).ready(function(){     
    $("#table1 > tr:odd").addClass("odd");     
    $("#table1 > tr:even").addClass("even");    
});

Source

2011-07-12 14:35:06 Chandu

-1

  $("#table1 > tr:odd").addClass("odd"); 
      $("#table1 > tr:not(.odd)").addClass("even");

Source

2011-07-12 14:35:19 Neal

-1

Vous avez juste besoin d'utiliser des sélecteurs CSS appropriés. Essayez:

$("#table1>tr:odd").addClass("odd");

Source

2011-07-12 14:35:50

Pour éviter traversal DOM redondant, vous pouvez utiliser quelque chose comme ceci:

$('#table1 > tbody') 
.filter('tr:odd').addClass('odd') 
.end() //break chain and return to the original tbody element 
.filter('tr:even').addClass('even')

Source

2013-07-08 08:01:15

jSélecteurs de recherche pour les lignes paires/impaires dans un tableau

Répondre

Questions connexes