Loop-Timer in JavaScript

73

Ich muss alle 2000 Millisekunden einen JavaScript-Code ausführen.

setTimeout('moveItem()',2000)

Das Obige führt eine Funktion nach 2000 Millisekunden aus, führt sie jedoch nicht erneut aus.

In meiner moveItem-Funktion habe ich also:

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

Dies funktioniert nicht, da ich den Trigger-Click-jQuery-Code in jedem Intervall von 2000 Millisekunden ausführen möchte, aber im Moment wird er ständig aufgerufen und das Skript muss unterbrochen werden. Abgesehen davon denke ich, dass dies eine sehr schlechte Codierungsqualität ist ... Wie würden Sie das lösen?

javascript jquery Marcos Buarque
quelle
Wann muss das Skript unterbrochen werden?
Natrium
1
Hallo, ich werde es nie unterbrechen.
Marcos Buarque

Antworten:

192

Beachten Sie, dass setTimeoutund setIntervalsind sehr unterschiedliche Funktionen:

  • setTimeoutden Code wird ausgeführt , einmal , nach dem Timeout.
  • setIntervalführt den Code für immer in Intervallen des angegebenen Timeouts aus.

Beide Funktionen geben eine Timer-ID zurück, mit der Sie das Timeout abbrechen können. Sie müssen diesen Wert lediglich in einer Variablen speichern und als Argument für clearTimeout(tid)bzw. clearInterval(tid)verwenden.

Je nachdem, was Sie tun möchten, haben Sie zwei gültige Optionen:

// 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);
}

oder

// 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);
}

Beides sind sehr gebräuchliche Wege, um dasselbe zu erreichen.

Miguel Ventura
quelle
Geh mit dem ersten. Es ist besser. Lassen Sie einfach die Timeout-Funktion einen neuen Timeout-Aufruf für sich selbst erstellen.
a432511
2
Sie machen mich offensichtlich zwischen setTimeoutund setInterval , Danke @ Miguel Ventura
Frank Myat Do
@ a432511 Sie scheinen sich etwas von mir zu unterscheiden, aber ich bin mir bei der Implementierung nicht sicher. Startet der Timer in setInterval am Anfang oder am Ende? Wenn der Timer am Ende gestartet wird, ist die tatsächliche Verzögerung die angegebene Verzögerung + die Zeit zum Ausführen des Codes. Ich gehe davon aus, dass setInterval der von Ihnen angegebenen Verzögerung genauer entspricht.
Cruncher
6 
setInterval(moveItem, 2000);

ist die Möglichkeit, die Funktion moveItemalle 2 Sekunden auszuführen . Das Hauptproblem in Ihrem Code besteht darin, dass Sie setIntervalinnerhalb und nicht außerhalb des Rückrufs anrufen . Wenn ich verstehe, was Sie versuchen, können Sie Folgendes verwenden:

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

setInterval(moveItem, 2000);

NB: Übergeben Sie keine Zeichenfolgen an setTimeoutoder setInterval- die beste Vorgehensweise besteht darin, eine anonyme Funktion oder eine Funktionskennung zu übergeben (wie oben beschrieben). Achten Sie auch darauf, keine einfachen und doppelten Anführungszeichen zu mischen. Wählen Sie eine und bleiben Sie dabei.

Matt Ball
quelle
2

Es sollte sein:

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

setInterval(f, t)Ruft die Argumentfunktion feinmal alle tMillisekunden auf.

ntownsend
quelle
0

Hier die automatische Schleifenfunktion mit HTML-Code. Ich hoffe, dass dies für jemanden nützlich sein kann.

<!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>

Geige: DEMO

Selvamani
quelle
-2

Sie sollten so etwas versuchen:

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

Dies bedeutet, dass Sie eine Funktion erstellen müssen, in der Sie die erforderlichen Aufgaben ausführen, und sicherstellen müssen, dass sie sich in einem von Ihnen gewünschten Intervall selbst aufruft. Rufen Sie in Ihrem Körper beim Laden die Funktion zum ersten Mal folgendermaßen auf:

<body onload="update()">
Younes
quelle
1
Code ist kaputt. Sie gehen undefinedzu setInterval und rufen update()ohne Pause für immer rekursiv an . (Hinweis: Der Rückgabewert von update () wird hier an setInterval übergeben.)
slebetman
1
-1 Sie erstellen ein neues Wiederholungsintervall jedes Mal, wenn Sie diese Funktion aufrufen .. es ist einfach falsch .. und hat das gleiche Problem, für das das OP um Hilfe bittet ..
Gabriele Petrioli