comment styliser de façon incrémentale avec javascript?

Question

Donc j'utilise jQuery et j'ai une assez grande table pour ce que je veux faire (> 100 lignes). Pour chaque ligne, je voudrais faire un peu de travail à ce sujet, ma question est de savoir si j'ai

$('#tableid>tr').each(function(i){some code here});

Comment puis-je arrêter le traitement quand je frappe des multiples de 5 et vient de mettre les effets sur sur le navigateur d'abord afin que l'utilisateur puisse interagir avec lui plutôt que de geler.

Merci beaucoup!

Jason

Answer 1

Essayez-:http://jsfiddle.net/5E3gs/

var $trs = $('#tableid tr'); 

for(var i = 0, len = $trs.length; i < len; i = i + 5) { 
    (function(i) { 
     setTimeout(function() { 
      $trs.slice(i,i + 5).addClass('yellow'); 
     }, (500 * (i/5))); 
    })(i); 
}; 

Answer 2

Hmm étrange. Qu'en est-il de l'utilisation de setTimeout pour appeler récursivement votre fonction?

Answer 3

Ce n'est pas sur des multiples de 5, mais vous pouvez utiliser setTimeout pour mettre en file d'attente les événements et laisser l'utilisateur interagir avec la page lorsque les événements se déclenchent.

Quelque chose comme:

$('#tableid>tr').each(function(i, e){ setTimeout(function(){ OtherFunc(e); }, (100 * i)) }); 

function OtherFunc(e) { 
    /* processing code */ 
} 

Ajustez les paramètres (en particulier les incréments de 100 ms) que nécessaire, mais vous voyez l'idée.

Answer 4

for(var i=0 ; i<$('#tableid>tr').length ; i+=5){ 
    var sliceEnd = i+4 > $('#tableid>tr').length-1 ? $('#tableid>tr').length-1 : i+4; 
    $('#tableid>tr').slice(i,sliceEnd).each(function(i){some code here}); 
} 

Doit faire l'affaire.