Minuterie de boucle en JavaScript

J'ai besoin d'exécuter un morceau de code JavaScript dire, chaque 2000 millisecondes.

setTimeout('moveItem()',2000)

Ce qui précède exécutera une fonction après 2000 millisecondes, mais ne l'exécutera plus.

Donc, dans ma fonction moveItem, j'ai:

function moveItem() {
    jQuery(".stripTransmitter ul li a").trigger('click');
    setInterval('moverItem()',2000);
}

Cela ne fonctionne pas parce que je veux exécuter le trigger click jQuery morceau de code chaque intervalle de 2000 millisecondes, mais en ce moment il est appelé tout le temps et le script doit être interrompu. Outre cela, j'ai l'impression que c'est très la mauvaise qualité de codage... Comment voulez-vous les gars résoudre ce problème?

64
demandé sur Brett DeWoody 2010-01-25 18:11:03

6 réponses

Remarque que setTimeout et setInterval sont des fonctions très différentes:

  • setTimeout exécutera le code une fois, après l'expiration du délai.
  • {[3] } exécutera le code pour toujours, dans les intervalles du délai d'attente fourni.

Les Deux fonctions renvoient un minuterie ID que vous pouvez utiliser pour interrompre le délai d'attente. Tout ce que vous avez à faire est de stocker cette valeur dans une variable et de l'utiliser comme argument de clearTimeout(tid) ou clearInterval(tid) respectivement.

Donc, en fonction de ce que vous voulez faire, vous avez deux choix possibles:

// set timeout
var tid = setTimeout(mycode, 2000);
function mycode() {
  // do some stuff...
  tid = setTimeout(mycode, 2000); // repeat myself
}
function abortTimer() { // to be called when you want to stop the timer
  clearTimeout(tid);
}

Ou

// set interval
var tid = setInterval(mycode, 2000);
function mycode() {
  // do some stuff...
  // no need to recall the function (it's an interval, it'll loop forever)
}
function abortTimer() { // to be called when you want to stop the timer
  clearInterval(tid);
}

Les deux sont des moyens très communs d'atteindre la même chose.

178
répondu Miguel Ventura 2010-01-25 17:20:05
setInterval(moveItem, 2000);

Est le pour exécuter la fonction moveItem toutes les 2 secondes. Le principal problème dans votre code est que vous appelez setInterval à l'intérieur, plutôt qu'à l'extérieur, du rappel. Si je comprends ce que vous essayez de faire, vous pouvez utiliser ceci:

function moveItem() {
    jQuery('.stripTransmitter ul li a').trigger('click');
}

setInterval(moveItem, 2000);

N.B.: ne passez pas de chaînes à setTimeout ou setInterval - la meilleure pratique consiste à passer une fonction anonyme ou un identifiant de fonction (comme je l'ai fait ci-dessus). Aussi, veillez à ne pas mélanger les guillemets simples et doubles. Choisissez-en un et de rester avec elle.

6
répondu Matt Ball 2010-01-25 15:17:03

Je crois que vous recherchez setInterval()

2
répondu Derek Adair 2010-01-25 15:17:05

Il devrait être:

function moveItem() {
  jQuery(".stripTransmitter ul li a").trigger('click');
}
setInterval(moveItem,2000);

setInterval(f, t) appelle la fonction d'argument, f, Une fois toutes les t millisecondes.

2
répondu ntownsend 2010-01-25 15:17:41

Voici la fonction de boucle automatique avec code html. J'espère que cela peut être utile pour quelqu'un.

<!DOCTYPE html>
<html>
<head>
<style>
div {
position: relative;
background-color: #abc;
width: 40px;
height: 40px;
float: left;
margin: 5px;
}
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<p><button id="go">Run »</button></p>
<div class="block"></div>
<script>

function test() {
$(".block").animate({left: "+=50", opacity: 1}, 500 );
   setTimeout(mycode, 2000);
};
$( "#go" ).click(function(){
test();
});
</script>
</body>
</html>

Violon: DÉMO

0
répondu Selvamani 2013-02-19 13:00:35

Vous devriez essayer quelque chose comme ceci:

 function update(){
    i++;
    document.getElementById('tekst').innerHTML = i;
    setInterval(update(),1000);
    }

Cela signifie que vous devez créer une fonction dans laquelle vous faites les choses que vous devez faire, et assurez-vous qu'il appellera lui-même, avec un intervalle que vous aimez. Dans votre corps onload appelez la fonction pour la première fois comme ceci:

<body onload="update()">
-3
répondu Younes 2010-01-25 15:17:18