Heim > Web-Frontend > js-Tutorial > Beispiele für die Verwendung von setInterval und setTimeout in js

Beispiele für die Verwendung von setInterval und setTimeout in js

高洛峰
Freigeben: 2017-02-08 16:10:15
Original
994 Leute haben es durchsucht

setInterval() Definition und Verwendung Die Methode

setInterval() führt eine Funktion oder einen Ausdruck in einem angegebenen Zeitraum (in Millisekunden) aus. Diese Methode ruft die Funktion weiterhin in einer Schleife auf, bis die Funktion explizit mit „clearInterval()“ gestoppt oder das Fenster geschlossen wird. Der Parameter der Funktion „clearInterval()“ ist der von setInterval() zurückgegebene ID-Wert.

Syntax

setInterval(code,millisec[,"lang"])
Code erforderlich. Eine aufzurufende Funktion oder eine auszuführende Codezeichenfolge.
Millisec ist ein Muss. Das Zeitintervall (in Millisekunden) zwischen periodischen Ausführungen oder Codeaufrufen.

Rückgabewert

Ein Wert, der an Window.clearInterval() übergeben werden kann, um die regelmäßige Ausführung von Code abzubrechen.

Verwendungsbeispiel:

Code kopieren Der Code lautet wie folgt:

<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<body>
<input type="text" id="clock" size="35" />
<script language=javascript>
var int=setInterval("clock()",50);
function clock(){
 var t=new Date();
 document.getElementById("clock").value=t;
}
</script>
</form>
<button onclick="window.clearInterval(int)">
停止 interval 事件</button>
</body>
</html>
Nach dem Login kopieren

setTimeout() Definition und Verwendung

Die Methode setTimeout() wird verwendet, um eine Funktion aufzurufen oder einen Ausdruck nach einer bestimmten Anzahl von Millisekunden zu berechnen. Diese Methode ist anders aus der setInterval()-Methode. Diese Methode wird nur einmal ausgeführt.

Syntax

setTimeout(code,millisec)
Code erforderlich. Die Zeichenfolge des JavaScript-Codes, der nach der aufzurufenden Funktion ausgeführt werden soll.
Millisekunden erforderlich. Die Anzahl der Millisekunden, die vor der Ausführung des Codes gewartet werden soll, in Millisekunden.

Tipps:
(1) Obwohl setTimeout() den Code nur einmal ausführt. Wenn Sie es jedoch mehrmals aufrufen müssen, können Sie zusätzlich zur Verwendung von setInterval () auch den ausgeführten Code selbst die Methode setTimeout () erneut aufrufen lassen, um den Zweck mehrerer Ausführungen zu erreichen.
(2) Darüber hinaus kann die Methode setTimeout() auch einen ID-Wert zurückgeben, um die Verwendung der Methode clearInterval() zu erleichtern und die Verwendung der Methode setTimeout() abzubrechen.

Verwendungsbeispiel:

Code kopieren Der Code lautet wie folgt:

<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
<script type="text/javascript">
function timedMsg(){
 var t=setTimeout("alert(&#39;3 秒时间到!&#39;)",3000);
}
function timedMsgAways(){
 alert(&#39;3 秒时间到!&#39;);
 var t=setTimeout("timedMsgAways()",3000);
}
</script>
</head>
<body>
<form>
<input type="button" value="3 秒后警告" onClick="timedMsg()"><br />
<input type="button" value="循环 3 秒警告" onClick="timedMsgAways()">
</form>
</body>
</html>
Nach dem Login kopieren

Für diese beiden Methoden ist zu beachten, dass es am besten ist, setInterval zu verwenden, wenn eine Aktion nach jedem festen Zeitintervall genau ausgeführt werden muss, und wenn Sie keine gegenseitige Beeinträchtigung verursachen möchten Kontinuierliche Aufrufe, insbesondere wenn jeder Funktionsaufruf umfangreiche Berechnungen und eine lange Verarbeitungszeit erfordert, ist es am besten, setTimeout zu verwenden.

Weitere Artikel zu den Verwendungsbeispielen von setInterval und setTimeout in js finden Sie auf der chinesischen PHP-Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage