javascript pour vérifier si l’élément est visible et définir «setInterval» en conséquence

LE2. Toute autre idée sur la façon de résoudre ce problème?

J’ai ce code et je ne peux pas comprendre pourquoi ne fonctionne pas correctement:

$(function autorun() { if ($("#contactForm").is(":visible")){ setInterval( "refreshAjax();", 150000000000 ); } else { setInterval( "refreshAjax();", 15000 ); } setTimeout("autorun();", 2000) });

…

Pour le moment, l’actualisation de la page se poursuit toutes les 2 secondes, même si “contactForm” est visible.

Ma logique est la suivante: si le “contactForm” est visible, retardez l’actualisation ou arrêtez-le, continuez de vérifier, mais dans l’intervalle, actualisez la page conformément à l’autre instruction.

LE.

 $(function() { refreshAjax = function(){$("#flex1").flexReload(); } });

LE2. Solution finale fournie ici par @Nick Craver

 $(function () { var ajaxTimeout; function autorun() { if ($("#contactForm").is(":visible")){ if(ajaxTimeout) { clearInterval(ajaxTimeout); ajaxTimeout = false; } } else if(!ajaxTimeout) { ajaxTimeout = setInterval(refreshAjax, 15000); } } setInterval(autorun, 2000); });

Merci Cristian.

Actuellement, vous créez beaucoup de timers, ce qui n’est pas bon. Je ne sais pas si cela résout votre problème, car en dehors de cela, votre code a l’air correct.

Essaie:

 var ajaxTimeout; function autorun() { if ($("#contactForm").is(":visible")){ if(ajaxTimeout) { clearInterval(ajaxTimeout); ajaxTimeout = false; } } else if(!ajaxTimeout) { ajaxTimeout = setInterval(refreshAjax, 15000); } } $(function() { setInterval(autorun, 2000) });

Rappelez-vous que le temps est en millisecondes.

Mise à jour: @tec a une autre solution intéressante. Cela dépend donc de ce que vous voulez réellement réaliser avec votre code.

Il semble que vous ne compreniez pas encore parfaitement le fonctionnement de setTimeout / setInterval. La première chose que vous devez savoir est que ces méthodes fonctionnent toujours de manière asynchrone. Le code Javascript ne s’arrête jamais et attend ou quelque chose. Au lieu de cela, votre méthode (et la stack d’appel) sont d’abord terminées; après cela, les appels de méthode différés sont exécutés. Je recommande de lire une bonne explication de “threading” en javascript comme: http://ejohn.org/blog/how-javascript-timers-work/

Donc, dans votre code, autorun () est appelé toutes les deux secondes. Toutes les deux secondes, le si est évalué. Si le formulaire de contact est visible, rien ne se passe, car je suppose que vous n’attendez pas 15 millions de secondes. Si ce n’est pas visible, vous commencez à appeler refreshAjax () dans un intervalle de 15 secondes. Mais rappelez-vous: cela se fait toutes les deux secondes. Ainsi, après 15 secondes, la première fois que refreshAjax () est appelée. Après 17 secondes encore et après 19,21, et ainsi de suite. Après 30 secondes, il commence à être appelé deux fois toutes les deux secondes.

Une solution simple serait la suivante:

 $(function autorun() { if ($("#contactForm").is(":visible")){ // It's visible, so don't do anything. // But check again in two seconds if it is still visible. setTimeout( "autorun();", 2000 ); } else { // it's not visible, yay! // Let's refresh and check again in 15 seconds setTimeout( "autorun();", 15000 ); refreshAjax(); // note that refreshAjax is called instantly, _not_ after 15 seconds } });