Seleccione cada 2 filas de la tabla con jquery

Question

Actualmente estoy usando este código para agregar una clase a cada dos filas en mi tabla.

$(".stripeMe tr:even").addClass("alt"); 

Sin embargo, en otra mesa me gustaría añadir una clase a las filas 3,4, 7,8, 11,12 y así sucesivamente ...

Es esto posible?

Answer 1

que tiene que hacer así:

$(".stripeMe tr:nth-child(4n)").add(".stripeMe tr:nth-child(4n-1)").addClass("alt");​​​​​​​​ 
//or... 
$("tr:nth-child(4n), tr:nth-child(4n-1)", ".stripeMe").addClass("alt");​​​​​​​​​​​​​​​​​ 

You can see this working here.

El uso de este:

$(".stripeMe tr:nth-child(4n), .stripeMe tr:nth-child(4n-1)").addClass("alt");​​​​​​​​ 

gets different results (a saber, en webkit, posiblemente otros).

Answer 2

Con el `: selector de orden n-child': http://api.jquery.com/nth-child-selector/

$(".stripeMe tr:nth-child(4n), .stripeMe tr:nth-child(4n-1)").addClass("alt"); 

Answer 3

Usted puede utilizar la función filter a filtrar el conjunto de lo que le gusta:

$(".stripeMe tr") 
.filter(function(i){ return (i % 4) >= 2; }) 
.addClass("alt"); 

Esto evitará que los artículos con el índice 2, 3, 6, 7, 10, 11 y así sucesivamente. Tenga en cuenta que el índice está basado en cero, por lo que la tercera fila es el índice dos.

Answer 4

Hice una aproximación diferente para este problema utilizando un método for loop y .eq().

var a = 2; // start from 2 because eq() counts from 0 
var b = 3; // start from 3 because eq() counts from 0 
var total = $('.stripeMe td').length; 

for (i = 0; i <= total; i++){ 
    if (i == a){ 
     $('.stripeMe tr:eq('+a+')').css('background', 'red'); 
     a+=4; 
    } 
    else if (i == b){ 
     $('.stripeMe tr:eq('+b+')').css('background', 'blue'); 
     b+=4; 
    } 
};