JavaScript biedt een vooraf gedefinieerde “ clearTime-out ()”-methode die de time-outfunctionaliteit beheert. Hiermee kunnen gebruikers het tijdsinterval annuleren dat eerder is vastgesteld door de “ setTime-out ()”-functie. Het stopt de uitvoering van het codeblok dat zich na een specifiek tijdsinterval herhaalt. Het wordt meestal gebruikt voor bank- en e-commercewebsites om geplande taken te annuleren.
In dit bericht wordt uitgelegd hoe u met de JavaScript-functie clearTimeout() omgaat.
Hoe om te gaan met de JavaScript-functie “clearTimeout()”?
De ' clearTime-out ()”-functie annuleert het tijdsinterval dat eerder was ingesteld met behulp van de “ setTime-out ()”-functie. De ' setTime-out ()”-functie stelt het tijdsinterval in voor het herhaaldelijk uitvoeren van een specifieke taak daarin.
Syntaxis
De werking van de “ clearTime-out ()”-methode is afhankelijk van de basissyntaxis die hieronder wordt beschreven:
clearTime-out ( id_van_settimeout )
Volgens de bovenstaande syntaxis is de “ clearTime-out ()” neemt de “ ID kaart ' van de ' setTime-out ()”-functie en stopt het tijdsinterval. Als de gebruiker de ID niet doorgeeft, voert deze niets uit.
Laten we de hierboven gedefinieerde functie implementeren door de basissyntaxis ervan te gebruiken.
Voorbeeld 1: De functie “clearTimeout()” toepassen om het ingestelde tijdsinterval te stoppen
Het eerste voorbeeld geldt de “ clearTime-out ()”-functie om het ingestelde tijdsinterval te stoppen.
Kijk eerst naar de volgende HTML-code:
< centrum >< P > Wacht 2 seconden, de pagina geeft een kop weer. < / P >
< h2 ID kaart = 'H2' >< / h2 >
< knop bij klikken = 'stop()' > Stop de executie! < / knop >
< / centrum >
In de bovenstaande coderegels:
- De “< centrum >”-tag stelt de uitlijning van de gegeven HTML-elementen in op het midden van de webpagina.
- De “< P >”-tag specificeert een alinea-instructie.
- De “< h2 >”tag is een leeg kopelement met een id “ H2 ”.
- De “< knop >”-tag voegt het knopelement in dat de “ stop ()” functie wanneer deze is aangesloten “ bij klikken '-gebeurtenis wordt geactiveerd.
Pas vervolgens de “ clearTime-out ()”-functie met behulp van het aangegeven codeblok:
< script >const tijd instellen = setTime-out ( begin , 2000 ) ;
functie begin ( ) {
document. getElementById ( 'H2' ) . innerlijkeHTML = 'Welkom bij Linuxhint!'
}
functie stop ( ) {
clearTime-out ( tijd instellen ) ;
}
script >
In het bovenstaande codefragment:
- De ' tijd instellen 'variabele past de ' setTime-out ()” functie die de “ begin ' functioneert als de eerste parameter en de opgegeven ' aantal milliseconden ” als de tweede parameter. Deze functie voert de “ begin ”functie in een gespecificeerd tijdsinterval.
- Definieer vervolgens de “ begin ()”-functie.
- In deze functie is de “ document.getElementById ()”methode wordt toegepast om toegang te krijgen tot het lege kopelement waarvan de id “ H2 ' en voeg het toe met de gegeven tekstverklaring.
- Daarna wordt de “ stop ()”-functie is gedefinieerd, die de “ clearTime-out ()”methode waarbij de id van de “ setTime-out ()”-functie om het tijdsinterval te stoppen.
Uitvoer (vóór uitvoering stoppen)
Nu toont de uitvoer een kopelement in een gespecificeerd tijdsinterval voordat het tijdsinterval wordt gestopt dat is ingesteld via de “ setTime-out ()” methode.
Uitgang (na stopuitvoering)
De gegeven knopklik stopt het tijdsinterval dat is ingesteld voor het weergeven van het kopelement.
Voorbeeld 2: De functie “clearTimeout()” toepassen om een functie te stoppen
Dit voorbeeld maakt gebruik van de “ clearTime-out ()” functie om de uitvoering van een functie te stoppen:
Doorloop eerst de meegeleverde HTML-code:
< centrum >< knop bij klikken = 'begin()' > Begin met tellen! < / knop >
< invoer type = 'tekst' ID kaart = 'veld' >
< knop bij klikken = 'stop()' > Stop met tellen! < / knop >
< / centrum >
In het bovenstaande codeblok:
- De “< knop >”tag voegt de “ bij klikken ”-gebeurtenis om de functie “start()” aan te roepen wanneer erop wordt geklikt.
- De “< invoer >”tag voegt een invoerveld toe met het type “ tekst ' en een id 'veld'.
- De volgende “< knop >” voegt ook de “ bij klikken evenement om de “ stop ()”-functie wanneer deze gebeurtenis wordt geactiveerd.
Pas nu de “ clearTime-out ()”-functie met behulp van deze coderegels:
< script >laten tegengaan = 0 ;
laat de tijd instellen ;
laat timer_aan = 0 ;
functie graaf ( ) {
document. getElementById ( 'veld' ) . waarde = balie ;
balie ++;
tijd instellen = setTime-out ( graaf , 1000 ) ;
}
functie begin ( ) {
als ( ! wekker aan ) {
wekker aan = 1 ;
graaf ( ) ;
}
}
functie stop ( ) {
clearTime-out ( tijd instellen ) ;
wekker aan = 0 ;
}
script >
In de bovenstaande regels code:
- In de eerste plaats de “ laten 'trefwoord declareert drie variabelen' counter”, “setTime” en “timer_on ”.
- Vervolgens wordt de “ graaf ()”-functie is gedefinieerd.
- In zijn definities wordt “ document.getElementById() 'methode wordt toegepast om toegang te krijgen tot het toegevoegde invoerveld met behulp van de id ' veld ' en voeg het toe met de waarde van de ' balie Variabel.
- Verhoog nu de waarde van de “ balie Variabel.
- Pas ten slotte de “ setTime-out ()” methode om de uitvoering van de “ graaf ()”-functie in een bepaald tijdsinterval.
- Definieer daarna een functie met de naam “ begin ()”.
- In deze functie is een “ als Er wordt een verklaring gebruikt die een voorwaarde specificeert, d.w.z. als “ imer_on ' is niet ' op ' dan is het gelijk aan ' 1 ' en de ' graaf ()”-functie wordt aangeroepen.
- Nu is er een andere functie gedefinieerd met de naam “ stop ()”.
- In zijn definitie luidt de “ clearTime-out ()”methode wordt toegepast, waarbij de id van de “ setTime-out ()” methode, d.w.z. “ tijd instellen ”.
Uitvoer
Er kan worden opgemerkt dat de “ Begin met tellen '-knop start de telling die na elke seconde toeneemt. Deze telling stopt door te klikken op de “ Stop met tellen! ' knop.
Dat gaat allemaal over het omgaan met de clearTimeout()-functie in JavaScript.
Conclusie
De ' clearTime-out ()”-functie verwerkt het tijdsinterval dat is opgegeven met behulp van de “ setTime-out ()”-functie. Het voert deze taak uit door de ID van de “setTimeout()” functioneren als de essentiële parameter. Het wordt gebruikt voor het annuleren van de taken die zijn uitgevoerd in het opgegeven tijdsinterval dat is ingesteld met behulp van de “ setTime-out ()”-functie. In dit bericht is praktisch de procedure uitgelegd voor het verwerken van de JavaScript clearTimeout()-functie.