suchen

Heim  >  Artikel  >  Web-Frontend  >  So erstellen Sie einen Timer mithilfe geplanter Ereignisse in JavaScript

So erstellen Sie einen Timer mithilfe geplanter Ereignisse in JavaScript

清浅
清浅Original
2018-11-24 13:44:043017Durchsuche

In JavaScript können Sie Timer-Effekte durch die geplanten Ereignisse setInterval und clearInterval erstellen. Die setInterval-Methode ruft eine Funktion auf oder berechnet einen Ausdruck gemäß einem angegebenen Zeitraum.

So erstellen Sie einen Timer mithilfe geplanter Ereignisse in JavaScript

Die Betriebsumgebung dieses Artikels: Windows 7-System, Javascript-Version 1.8.5, Dell G3-Computer.

Heute werde ich das Wissen über Timer in JavaScript mit Ihnen teilen. Es hat einen gewissen Referenzwert und ich hoffe, dass es für alle hilfreich sein wird.

Ein einfacher Timer-Effekt kann durch die geplanten Ereignisse setInterval und clearInterval() in JavaScript erstellt werden, die im folgenden Artikel ausführlich vorgestellt werden.

setInterval()-Methode

dient dazu, eine Funktion aufzurufen oder einen Ausdruck gemäß dem angegebenen Zeitraum (in Millisekunden) zu berechnen. 

setInterval(code,millisec[,"lang"])

Code: Die aufzurufende Funktion oder der auszuführende Code

Millisec: Das Zeitintervall zwischen periodischer Ausführung oder Codeaufrufen in Millisekunden

Bei Aufruf Wenn der Wenn die Methode setInterval() verwendet wird, ruft sie die Funktion weiterhin auf, bis die Funktion clearInterval() erscheint oder das Fenster geschlossen wird, und der von setInterval() zurückgegebene ID-Wert kann als Parameter der Methode clearInterval() verwendet werden.

Aber das Timing der setInterval()-Methode weist einen bestimmten Fehler auf

Die setTimeout()-Methode

wird verwendet, um eine Funktion nach a aufzurufen angegebene Anzahl von Millisekunden oder Berechnen Sie den Ausdruck, aber rufen Sie ihn nur einmal auf. Es gibt auch die Methode „clearTimeout()“, um setTimeout() zu löschen und die Ausführung zu stoppen

Case-Sharing

Verwenden Sie die Methode setInterval(). Schreiben Sie einen Timer innerhalb von zwei Minuten 

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
input{
width:100px;
height:40px;
background:pink;
color:#fff;
font-size: 20px;
text-align: right;
}
</style>
</head>
<body>
分钟：<input type="text" value="0">
秒数：<input type="text" value="0">
<script src="tool.js"></script>
<script>
var minutes=document.getElementsByTagName("input")[0];
var seconds=document.getElementsByTagName("input")[1];
          var minutes1=0;
          var seconds1=0;
          var timer=setInterval(function(){
          //秒数自增，当秒数增加到60时分钟自增，秒数清零
               seconds1++;
      if(seconds1==60)
      {
seconds1=0;
     minutes1++;
     }
     minutes.value=minutes1;
     seconds.value=seconds1;
     if(minutes1==2)//到两分钟的时候定时器清除
     {
clearInterval(timer);
}
      
},100)      
</script>
</body>
</html>

So erstellen Sie einen Timer mithilfe geplanter Ereignisse in JavaScript

Zusammenfassung: Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, dass es für alle hilfreich sein wird, zeitgesteuerte Ereignisse zu lernen.

Das obige ist der detaillierte Inhalt vonSo erstellen Sie einen Timer mithilfe geplanter Ereignisse in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

JavaScript 事件
Stellungnahme：
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
Vorheriger Artikel：Wie JavaScript im Browser geladen wirdNächster Artikel：Wie JavaScript im Browser geladen wird

In Verbindung stehende Artikel

Mehr sehen