Javascript settimeout abbrechen

JavaScript ist eine beliebte Programmiersprache, mit der interaktive Elemente und Logik in Webanwendungen geschrieben werden können. Unter diesen ist setimeout eine in JavaScript integrierte Funktion, die den angegebenen Code nach einer bestimmten Verzögerung ausführen kann. Manchmal ist es jedoch erforderlich, den setTimeout-Timer während der Ausführung abzubrechen. In diesem Artikel erfahren Sie, wie Sie den setTimeout-Timer mithilfe der JavaScript-Sprache abbrechen.

1. Grundlegender Überblick über die setTimeout-Funktion

Bevor wir vorstellen, wie man setTimeout abbricht, wollen wir zunächst die grundlegende Verwendung und die Konzepte der setTimeout-Funktion verstehen.

Die setTimeout-Funktion ist eine globale Funktion in JavaScript. Ihre Funktion besteht darin, die Ausführung des angegebenen Codes nach einer bestimmten Zeitspanne zu verzögern. Die spezifische Verwendung ist wie folgt:

setTimeout(function(){
  //执行的代码
},延迟的毫秒数)

Unter diesen stellt die Funktion die zu verzögernde Funktion dar, und die Anzahl der zu verzögernden Millisekunden ist ein numerischer Parameter, der die zu verzögernde Zeit in Millisekunden angibt. Wenn Sie beispielsweise eine Funktion nach 500 Millisekunden ausführen möchten, können Sie den folgenden Code verwenden:

setTimeout(function(){
  console.log('延迟500毫秒后执行的代码。')
},500)

2. So verwenden Sie die Funktion „clearTimeout“, um den Timer „setTimeout“ abzubrechen

Wenn die Verzögerungszeit in der Funktion „setTimeout“ zu lang ist oder unsicher ist, müssen Sie möglicherweise den Timer abbrechen, während er läuft. Zu diesem Zeitpunkt können Sie die Funktion „clearTimeout“ des Fensterobjekts verwenden. Diese Funktion kann die Pause der noch nicht ausgeführten setTimeout-Funktion abbrechen.

Die Funktion „clearTimeout“ wird wie folgt verwendet:

var timer = setTimeout(function(){
  console.log('延迟执行的代码。')
},3000)

//取消计时器
clearTimeout(timer);

Im obigen Codebeispiel wird eine Variable mit dem Namen „timer“ definiert, um den Timer „last1“ zu speichern, und dann wird die Funktion „clearTimeout“ verwendet, um diesen Timer abzubrechen. Wenn Sie die Verzögerung vor der Ausführung des Codes aufheben müssen, können Sie auf diese Weise die Funktion „clearTimeout“ verwenden.

3. Der Timer von setTimeout kann abgebrochen werden, der interne Code kann jedoch nicht gestoppt werden.

Es ist zu beachten, dass der Timer über die Funktion „clearTimeout“ abgebrochen werden kann, der im Timer ausgeführte Code jedoch nicht gestoppt werden kann. Das heißt, wenn Sie eine Funktion definieren, die immer innerhalb der setTimeout-Funktion ausgeführt wird, wird die Funktion auch dann weiter ausgeführt, wenn der Timer abgebrochen wird, bis die Funktion abgeschlossen ist.

Im folgenden Codebeispiel wird beispielsweise eine setInterval-Funktion definiert, die einmal pro Sekunde ausgeführt wird. Selbst wenn der Timer abgebrochen wird, stoppt die Funktion nach einmaliger Ausführung.

var timer = setTimeout(function(){
  setInterval(function(){
    console.log('每秒执行一次的代码。')
  },1000)
},5000)

//取消计时器
clearTimeout(timer)

4. Praktische Anwendung von setTimeout und clearTimeout

Lassen Sie uns nun einen Blick auf die praktische Anwendung von setTimeout und clearTimeout werfen.

In praktischen Anwendungen werden die Funktionen setTimeout und clearTimeout normalerweise in Szenarien verwendet, die eine verzögerte Ausführung von Code, Code, der eine Abfrage erfordert, und die Bereitstellung von Feedback für Benutzer erfordern. Zum Beispiel:

1. Verzögerte Ausführung von Code

In einigen Szenarien, in denen vor der Ausführung eine gewisse Zeit gewartet werden muss, können Sie dies mit der Funktion „setTimeout“ erreichen, z. B. indem Sie die Suchaufforderung automatisch ausfüllen, nachdem der Benutzer Folgendes eingegeben hat:

var timer;
function handleChange(){
  clearTimeout(timer)
  timer = setTimeout(function(){
    console.log('自动完成搜索提示')
  },500)
}

2. Abfragecode

In einigen Szenarien, die Echtzeitaktualisierungen erfordern, können Sie die Funktion setInterval verwenden, um die Abfrage zu implementieren. Aktualisieren Sie beispielsweise von Zeit zu Zeit Daten vom Server:

var timer = setInterval(function(){
  console.log('从服务器轮询数据')
},5000)

//取消轮询
clearInterval(timer)

3. Feedback-Code

In einigen Szenarien, in denen den Benutzern Feedback gegeben werden muss, kann die Funktion setTimeout verwendet werden. Zum Beispiel Countdown, Ausführen bestimmter Vorgänge nach dem Warten usw.:

var count = 10;
var timer = setInterval(function(){
  count--
  console.log('还有' + count + '秒...')
  if(count == 0){
    clearInterval(timer)
    console.log('倒计时结束')
  }
},1000)

Zusammengenommen sind die Funktionen setTimeout und clearTimeout sehr einfach, können jedoch in praktischen Anwendungen eine große Rolle spielen, indem sie die Webseite und die Benutzeroberfläche funktionaler machen freundlicher.

Das obige ist der detaillierte Inhalt vonJavascript settimeout abbrechen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!