So verwenden Sie die setTimeout-Methode-js-Tutorial-php.cn

So verwenden Sie die setTimeout-Methode

不言

Freigeben： 2019-01-30 16:26:21

Original

22928 Leute haben es durchsucht

Die Methode setTimeout() ruft die Funktion nach der in Millisekunden angegebenen Zeit auf. Die Methode setTimeout erfordert zwei Parameter: einen Verweis auf die Callback-Funktion und eine Verzögerung in Millisekunden Methode. Spezifische Verwendung.

So verwenden Sie die setTimeout-Methode

Werfen wir zunächst einen Blick auf die grundlegende Syntax von setTimeout

setTimeout(function, milliseconds, param_one, param_two, ...)

Nach dem Login kopieren

Um setTimeout zu stoppen und die Ausführung der Funktion zu verhindern, müssen Sie „clearTimeout“ verwenden ()-Methode.

Die Methode setTimeout() gibt eine ID zurück, die in der Methode clearTimeout() verwendet werden kann.

Schauen wir uns ein einfaches Beispiel an

Der Code lautet wie folgt

<!DOCTYPE html>
<html>
<body>

<script>
  var sampleVar;
  function sampleFunction(){    
    sampleVar = setTimeout(alertFunc, 2000);
  }
  function alertFunc(){    
    alert("Two seconds have passed!");
  }
  sampleFunction();
</script>

</body>
</html>

Nach dem Login kopieren

Der obige Code öffnet nach 2 Sekunden ein Popup-Fenster.

Beispiel 2

In diesem Beispiel ändert sich der Text des Elements alle 2 Sekunden (3 Mal). Dazu muss die ID eines HTML-Elements auf „counter“ gesetzt werden.

Der Code lautet wie folgt

<!DOCTYPE html>
<html>
<body>

<p>单击下面的按钮。输入字段将显示经过2、4和6秒。</p>

<button onclick="timedText()">Display timed text</button>

<input type="text" id="text">

<script>
function timedText() {
    var x = document.getElementById("text");
    setTimeout(function(){ x.value="2 seconds" }, 2000);
    setTimeout(function(){ x.value="4 seconds" }, 4000);
    setTimeout(function(){ x.value="6 seconds" }, 6000);
}
</script>

</body>
</html>

Nach dem Login kopieren

Der Anzeigeeffekt im Browser ist wie folgt

So verwenden Sie die setTimeout-Methode

Wenn Sie auf die Schaltfläche links klicken , der Vorgang wird im Textfeld 2, 4, 6 Sekunden angezeigt

Dieses Beispiel stoppt „timeout“, wenn „samplestopfunction“ aufgerufen wird, bevor der Timer abgelaufen ist.

Der Code lautet wie folgt

<!DOCTYPE html>
<html>
<body>

<p>等待3秒钟后，单击第一个按钮显示“Hi”。</p>
<p>单击第二个按钮以阻止执行第一个函数<br>（必须在3秒钟前单击它）</p>

<button onclick="sampleFunction()">Try it</button>
<button onclick="sampleStopFunction()">Stop the alert</button>

<script>
var sampleVar;

function sampleFunction() {
 sampleVar = setTimeout(function(){ alert("Hi") }, 2000);
}

function sampleStopFunction() {
 clearTimeout(sampleVar);
}
</script>

</body>
</html>

Nach dem Login kopieren

Der Anzeigeeffekt im Browser ist wie folgt

So verwenden Sie die setTimeout-Methode

Dieser Artikel endet hier, weitere spannende Inhalte Sie können auf die entsprechenden Kolumnen-Tutorials auf der chinesischen PHP-Website achten! ! !

Das obige ist der detaillierte Inhalt vonSo verwenden Sie die setTimeout-Methode. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!