Wie gehe ich mit der JavaScript-Funktion ClearTimeout() um?

Wie Gehe Ich Mit Der Javascript Funktion Cleartimeout Um



JavaScript bietet ein vordefiniertes „ clearTimeout ()“-Methode, die die Timeout-Funktionalität verwaltet. Es ermöglicht Benutzern, das Zeitintervall aufzuheben, das zuvor durch „ setTimeout ()“-Funktion. Es stoppt die Ausführung des Codeblocks, der nach einem bestimmten Zeitintervall wiederholt wird. Es wird hauptsächlich für Banking- und E-Commerce-Websites verwendet, um geplante Aufgaben abzubrechen.

In diesem Beitrag wird erläutert, wie mit der JavaScript-Funktion „clearTimeout()“ umgegangen wird.







Wie gehe ich mit der JavaScript-Funktion „clearTimeout()“ um?

Der ' clearTimeout ()“ Funktion bricht das Zeitintervall ab, das zuvor mit Hilfe der Funktion „ setTimeout ()“-Funktion. Der ' setTimeout ()“-Funktion legt das Zeitintervall fest, in dem eine bestimmte Aufgabe wiederholt ausgeführt wird.



Syntax

Die Arbeitsweise des „ clearTimeout ()“-Methode hängt von ihrer grundlegenden Syntax ab, die unten beschrieben wird:



clearTimeout ( id_of_settimeout )

Gemäß der obigen Syntax ist das „ clearTimeout ()' nimmt die ' Ausweis ' des ' setTimeout ()“-Funktion und stoppt das Zeitintervall. Wenn der Benutzer die ID nicht übergibt, führt er nichts aus.





Lassen Sie uns die oben definierte Funktion implementieren, indem wir ihre grundlegende Syntax verwenden.

Beispiel 1: Anwenden der Funktion „clearTimeout()“, um das eingestellte Zeitintervall zu stoppen

Das erste Beispiel wendet das „ clearTimeout ()“-Funktion, um das eingestellte Zeitintervall zu stoppen.



Schauen Sie sich zunächst den folgenden HTML-Code an:

< Center >
< P > Warten Sie 2 Sekunden, die Seite zeigt eine Überschrift an. < / P >
< h2 Ausweis = „H2“ >< / h2 >
< Taste onclick = 'stoppen()' > Stoppen Sie die Ausführung! < / Taste >
< / Center >

In den obigen Codezeilen:

  • Das „< Center >“-Tag legt die Ausrichtung der angegebenen HTML-Elemente auf die Mitte der Webseite fest.
  • Das „< P >“-Tag gibt eine Absatzanweisung an.
  • Das „< h2 >“-Tag ist ein leeres Überschriftenelement mit einer ID „ H2 “.
  • Das „< Taste >“-Tag fügt das Schaltflächenelement ein, das „“ aufruft. stoppen ()“-Funktion, wenn sie angehängt ist „ onclick „Ereignis wird ausgelöst.

Als nächstes wenden Sie „ clearTimeout ()“-Funktion mit dem angegebenen Codeblock:

< Skript >
const Zeit einstellen = setTimeout ( Start , 2000 ) ;
Funktion Start ( ) {
dokumentieren. getElementById ( „H2“ ) . innerHTML = „Willkommen bei Linuxhint!“
}
Funktion stoppen ( ) {
clearTimeout ( Zeit einstellen ) ;
}
Skript >

Im obigen Codeausschnitt:

  • Der ' Zeit einstellen Die Variable „wendet“ an: setTimeout ()“-Funktion, die die „ Start ”-Funktion als erster Parameter und die angegebene „ Anzahl der Millisekunden ” als zweiten Parameter. Diese Funktion führt das „ Start ”-Funktion in einem bestimmten Zeitintervall.
  • Als nächstes definieren Sie „ Start ()“-Funktion.
  • In dieser Funktion ist das „ document.getElementById ()“-Methode wird angewendet, um auf das leere Überschriftenelement zuzugreifen, dessen ID „ H2 ” und hängen Sie es mit der angegebenen Textanweisung an.
  • Danach wird das „ stoppen ()“-Funktion definiert, die die „ clearTimeout ()“-Methode, die die ID der „ setTimeout ()“-Funktion, um das Zeitintervall zu stoppen.

Ausgabe (vor Stopp der Ausführung)

Jetzt zeigt die Ausgabe ein Überschriftenelement in einem bestimmten Zeitintervall an, bevor das über die Option „ setTimeout ()' Methode.

Ausgabe (nach Stop-Ausführung)

Der angegebene Tastenklick stoppt das eingestellte Zeitintervall für die Anzeige des Überschriftenelements.

Beispiel 2: Anwenden der Funktion „clearTimeout()“, um eine Funktion zu stoppen

Dieses Beispiel verwendet das „ clearTimeout ()“-Funktion, um die Ausführung einer Funktion zu stoppen:

Gehen Sie zunächst den bereitgestellten HTML-Code durch:

< Center >
< Taste onclick = 'Start()' > Beginnen Sie mit der Zählung! < / Taste >
< Eingang Typ = 'Text' Ausweis = 'Feld' >
< Taste onclick = 'stoppen()' > Hör auf zu zählen! < / Taste >
< / Center >

Im obigen Codeblock:

  • Das „< Taste >“-Tag fügt das „ onclick ”-Ereignis, um die Funktion „start()“ aufzurufen, wenn darauf geklickt wird.
  • Das „< Eingang >“-Tag fügt ein Eingabefeld mit dem Typ „ Text ” und ein ID-„Feld“.
  • Das nächste „< Taste >“ fügt auch das „ onclick ” Veranstaltung zum Aufrufen des „ stoppen ()“-Funktion, wenn dieses Ereignis ausgelöst wird.

Wenden Sie nun das „ clearTimeout ()“-Funktion mit diesen Codezeilen:

< Skript >
kontern lassen = 0 ;
lass setTime ;
lass timer_on = 0 ;

Funktion zählen ( ) {
dokumentieren. getElementById ( 'Feld' ) . Wert = Schalter ;
Schalter ++;
Zeit einstellen = setTimeout ( zählen , 1000 ) ;
}

Funktion Start ( ) {
Wenn ( ! Timer an ) {
Timer an = 1 ;
zählen ( ) ;
}
}

Funktion stoppen ( ) {
clearTimeout ( Zeit einstellen ) ;
Timer an = 0 ;
}
Skript >

In den obigen Codezeilen:

  • Erstens, die „ lassen „Schlüsselwort deklariert drei Variablen“ counter“, „setTime“ und „timer_on“. “.
  • Als nächstes wird das „ zählen ()“-Funktion definiert ist.
  • In seinen Definitionen heißt es: „ document.getElementById() Die Methode wird angewendet, um über ihre ID auf das hinzugefügte Eingabefeld zuzugreifen. Feld ” und hängen Sie es mit dem Wert von „ an Schalter ” variabel.
  • Erhöhen Sie nun den Wert von „ Schalter ” variabel.
  • Wenden Sie abschließend das „ setTimeout ()“-Methode zur Durchführung der Ausführung von „ zählen ()“-Funktion in einem bestimmten Zeitintervall.
  • Definieren Sie anschließend eine Funktion mit dem Namen „ Start ()“.
  • In dieser Funktion wird ein „ Wenn Es wird eine Anweisung verwendet, die eine Bedingung angibt, z. B. wenn „ imer_on ' ist nicht ' An “ dann ist es gleich „ 1 ' und das ' zählen ()“-Funktion aufgerufen wird.
  • Jetzt wird eine weitere Funktion mit dem Namen „ stoppen ()“.
  • In seiner Definition lautet „ clearTimeout ()“-Methode wird angewendet und übergibt die ID von „ setTimeout ()“-Methode, d. h. „ Zeit einstellen “.

Ausgabe

Es lässt sich beobachten, dass „ Zählung starten Die Schaltfläche „Startet die Zählung, die alle 1 Sekunde erhöht wird. Diese Zählung stoppt, indem Sie auf das „ Hör auf zu zählen! ' Taste.

Hier dreht sich alles um die Handhabung der Funktion „clearTimeout()“ in JavaScript.

Abschluss

Der ' clearTimeout ()“-Funktion verarbeitet das mit Hilfe der „ setTimeout ()“-Funktion. Diese Aufgabe wird durch Übergabe der ID ausgeführt „setTimeout()“ Funktion als dessen wesentlicher Parameter. Es wird für den Abbruch der Aufgaben verwendet, die in dem angegebenen Zeitintervall ausgeführt wurden, das mit der Option „ setTimeout ()“-Funktion. In diesem Beitrag wurde die Vorgehensweise zur Handhabung der JavaScript-Funktion „clearTimeout()“ praktisch erklärt.