Javascript (jQuery) encore en cours d'exécution après tout ce que son travail est terminé

Question

J'utilise jQuery pour charger une table massive en lots de lignes. Je charge les lignes initiales, puis je fais des appels $ .ajax pour ajouter des lignes au corps de la table. À la fin de l'insertion du prochain bloc de lignes, j'appelle la méthode pour traiter le prochain bloc de lignes. Voir le code ci-dessous. Le problème est, même après tout le contenu est chargé, le javascript prétend encore être en cours d'exécution - quand je vais naviguer vers une autre page se plaint qu'il ya une routine javascript ralentir la page et que je veux l'avorter. À ce stade, il ne devrait pas fonctionner! Cette routine est initialement appelée à partir de la routine $ (function() {...}) (en attente). Des idées sur comment je suis censé empêcher cela de continuer après que tout a fini son travail?

 function processNextChunk(c, t, s, p, x) { 
     var args = "{company_ID:" + c + ",shareholdingType:" + t + ",startIndex:" + s + ",pageSize:" + p + ",stack:'" + x + "'}"; 
     //alert(args); 
     $.ajax({ 
      type: "POST", 
      url: "TestStructure6.aspx/GetNextHierarchyPage", 
      data: args, 
      contentType: "application/json; charset=utf-8", 
      dataType: "json", 
      success: function(msg) { 
       //Append the content to the bottom of the table tag. 
       //Returning 2 arguments from the result, hence the split (initial 
       //value is an int, so not a big deal using pipe as a delimiter) 
       if (msg.d.length > 0) { 
        var slash = msg.d.indexOf('|'); 
        var r; 
        if (slash > 0) { 
         x = msg.d.substr(0, slash); 
         r = msg.d.substr(slash + 1, msg.d.length - slash); 
         $('#h > tbody').append(r); 
         if (r.length > 0) { 
          var percent = (s + p)/totalRows * 100; 
          $('#counter').html(parseInt(percent) + '%'); 
          setTimeout('processNextChunk(' + c + ', ' + t + ', ' + (s + p) + ', ' + p + ', "' + x + '")', 0); 
          //processNextChunk(c, t, s + p, p, x) 
         } 
         else { 
          $('#counter').html(''); 
         } 
        } 
       } 
       return true; 
      } 
     }); 
     return true; 
    } 

Answer 1

Cela peut ou peut ne pas résoudre votre problème, mais vous ne devriez pas appellerez setTimeout avec un argument de chaîne.

Au lieu de cela, vous devez lui donner une fonction, comme ceci:

setTimeout(function() { 
    processNextChunk(c, t, s + p, p); 
}, 0); 

En outre, au lieu d'écrire $('#counter').html(''), vous pouvez écrire $('#counter').empty().

Pour résoudre votre problème, êtes-vous sûr que votre setTimeout appelle récursivement pour toujours?

Answer 2

Je ne peux pas dire exactement quelles données sont retournées dans le cas où vous avez récupéré toutes les lignes. Je suppose qu'il est censé faire échouer le chèque:

r = msg.d.substr(slash + 1, msg.d.length - slash); 

Si tel est le cas, vous pourriez être en mesure d'utiliser clearTimeout() dans votre clause else juste après:

$('#counter').html(''); 

Answer 3

Vous appelez setTimeout (..., 0) alias un timeout nul. En d'autres termes, vous n'autorisez pas le navigateur à mettre à jour/redessiner. Notez que cela dépend du navigateur - certains tests effectués sur diverses machines au cours des années indiquent que winxp nécessite au moins un timeout de 50, alors que linux requiert un timeout de 10. Il semble que cela soit lié au temps minimum du système d'exploitation cédulaire

Si vous êtes sur une connexion rapide (par exemple: le développement localhost), peut-être l'appel ajax répond suffisamment rapide pour que la mise à zéro est un problème ...

Votre code semble que cela pourrait faire avec Il suffit d'augmenter le délai d'attente pour atteindre un temps plus long, disons 1 seconde, sans effets négatifs. [L'appel de setTimeout avec un argument de chaîne est parfaitement valide, mais il semble que vous ne citiez pas correctement. ]