Javascript - Jquery .load() et setInterval() question

Question

Disons que je fais:

$("#content").load(...); 

Dans ce que je suis chargement javascript est inclus:

var myCounter = 0; 
var myInterval = setInterval(function(){ 
    myCounter++; 

    $("#counter-display").html("Count: "+myCounter); 
}); 

Pour une raison inconnue , si je recharge le contenu avec $ ("# content"). load (...); - myInterval est maintenant appelé deux fois.

J'ai essayé de faire quelque chose comme:

if (myInterval !== undefined){ 
    //dont set interval again 
} 

Cependant, cela ne fonctionne pas. Est-ce que quelqu'un connaît une méthode quelconque pour que myInterval soit effacé sur .load, sans avoir besoin de mettre le javascript en dehors du fichier chargé?

Answer 1

Essayez de garder l'intervalle et compter dans l'objet de données sur l'élément de contre, comme ceci:

var disp = $("#counter-display"); 
if(!disp.data("interval")) { 
    disp.data("interval", setInterval(function() { 
    var count = (disp.data("count") || 0) + 1; 
    disp.data("count", count).html("Count: " + count); 
    }, 500)); 
} 

Un peu plus de code une fois, mais beaucoup plus propre pour les variables globales, etc.

Answer 2

Votre code est en cours d'exécution deux fois.

Essayez de vérifier if (typeof myInterval !== "undefined") avant de déclarer la variable.

Answer 3

Vous » ll trouvera probablement que myInterval est en cours de définition dans une portée locale.

Essayez d'utiliser:

var myCounter = 0; 
myInterval = setInterval(function(){ 
    myCounter++; 

    $("#counter-display").html("Count: "+myCounter); 
}); 

myInterval sera maintenant déclaré dans la portée globale.

Vous pouvez bien sûr utiliser clearInterval, et faire clearInterval(myInterval) qui assurera également que seulement sur l'instance de l'intervalle est en cours d'utilisation.