JavaScript-Timing-Ereignisse verstehen und verwenden

JavaScript-Timing-Ereignisse spielen eine wichtige Rolle bei der Zeitberechnung der Website. In diesem Artikel erfahren Sie mehr darüber.

JavaScript-Timing-Ereignisse

Durch die Verwendung von JavaScript haben wir die Möglichkeit, Code nach einem festgelegten Zeitintervall auszuführen, anstatt unmittelbar nach dem Aufruf der Funktion. Wir nennen dies ein Timing-Ereignis.

Die Verwendung von Timing-Ereignissen in JavaScript ist sehr einfach. Die beiden wichtigsten Methoden sind:

setInterval() - 间隔指定的毫秒数不停地执行指定的代码。
setTimeout() - 在指定的毫秒数后执行指定代码。

Hinweis: setInterval() und setTimeout() sind zwei Methoden des HTML-DOM-Fensterobjekts.

setInterval() 方法
setInterval() 间隔指定的毫秒数不停地执行指定的代码

Syntax

window.setInterval("javascript function",milliseconds);
window.setInterval() 方法可以不使用window前缀，直接使用函数setInterval()。
setInterval() 第一个参数是函数（function）。

Die Anzahl der Millisekunden zwischen dem zweiten Parameter

Hinweis: 1000 Millisekunden sind eine Sekunde.

Beispiel

Popup „Hallo“ alle drei Sekunden:

setInterval(function(){alert("Hello")},3000);
实例展示了如何使用 setInterval() 方法，但是每三秒弹出一次对用户体验并不好。

Das folgende Beispiel zeigt die aktuelle Uhrzeit an. Die Methode setInterval() legt den Code fest, der jede Sekunde ausgeführt werden soll, genau wie eine Uhr.

Instanz

Zeigt die aktuelle Zeit an

var myVar=setInterval(function(){myTimer()},1000); 
function myTimer(){
    var d=new Date();    var t=d.toLocaleTimeString();    document.getElementById("demo").innerHTML=t;}

Wie stoppe ich die Ausführung?

Die Methode „clearInterval()“ wird verwendet, um den Funktionscode von setInterval() zu stoppen Methodenausführung.

Syntax

window.clearInterval(intervalVariable)

window.clearInterval()-Methode kann die Funktion clearInterval() direkt verwenden, ohne das Fensterpräfix zu verwenden.

Um die Methode „clearInterval()“ zu verwenden, müssen Sie beim Erstellen der Timing-Methode eine globale Variable verwenden:

myVar=setInterval("javascript function",milliseconds);

Anschließend kann die Ausführung mit der Methode „clearInterval()“ gestoppt werden.

Beispiel

Im folgenden Beispiel haben wir die Schaltfläche „Stopp“ hinzugefügt:

<p id="demo"></p><button onclick="myStopFunction()">停止</button><script>var myVar=setInterval(function(){myTimer()},1000);
function myTimer(){
    var d=new Date();
    var t=d.toLocaleTimeString();
    document.getElementById("demo").innerHTML=t;
}
function myStopFunction(){
    clearInterval(myVar);
}</script>

setTimeout()-Methode

Syntax

myVar= window.setTimeout("javascript function", milliseconds);
setTimeout() 方法会返回某个值。在上面的语句中，值被储存在名为 myVar 的变量中。假如你希望取消这个 setTimeout()，你可以使用这个变量名来指定它。
setTimeout() 的第一个参数是含有 JavaScript 语句的字符串。这个语句可能诸如 "alert('5 seconds!')"，或者对函数的调用，诸如 alertMsg。

Kapitel Die beiden Parameter geben an, in wie vielen Millisekunden der erste Parameter ausgeführt wird.

Tipp: 1000 Millisekunden entsprechen einer Sekunde.

Instanz

Warten Sie 3 Sekunden und zeigen Sie dann „Hallo“ an:

setTimeout(function(){alert("Hello")},3000);

Wie kann ich die Ausführung stoppen?

Die Methode „clearTimeout()“ wird verwendet um die Ausführung des Funktionscodes der setTimeout( )-Methode zu stoppen.

Syntax

window.clearTimeout(timeoutVariable)

Die Methode window.clearTimeout() muss nicht das Fensterpräfix verwenden.

Um die Methode „clearTimeout()“ zu verwenden, müssen Sie die globale Variable in der erstellten Timeout-Methode (setTimeout) verwenden:

myVar=setTimeout("javascript function",milliseconds);

Wenn die Funktion noch nicht ausgeführt wurde, können Sie die Methode „clearTimeout“ verwenden ()-Methode zum Stoppen des Funktionscodes.

Beispiel

Das Folgende ist das gleiche Beispiel, jedoch mit der hinzugefügten Schaltfläche „Alarm stoppen“:

var myVar; 
function myFunction(){
    myVar=setTimeout(function(){alert("Hello")},3000);}
 function myStopFunction(){
    clearTimeout(myVar);}

Dieser Artikel enthält eine detaillierte Erklärung zur Verwendung von Timing-Ereignissen In js finden Sie weitere Lernmaterialien auf der chinesischen PHP-Website.

Verwandte Empfehlungen:

JavaScript-Cookies verstehen und verwenden

JavaScript-Cookies verstehen und verwenden

Verwandte Erklärungen zur JavaScript-Formularvalidierung

Das obige ist der detaillierte Inhalt vonJavaScript-Timing-Ereignisse verstehen und verwenden. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!