JavaScript erbjuder en fördefinierad ' clearTimeout ()”-metoden som hanterar timeout-funktionen. Det tillåter användare att avbryta tidsintervallet som tidigare fastställts av ' setTimeout ()” funktion. Den stoppar exekveringen av kodblocket som upprepas efter det specifika tidsintervallet. Det används mest för bank- och e-handelswebbplatser för att avbryta schemalagda uppgifter.
Det här inlägget kommer att förklara hur man hanterar JavaScript clearTimeout()-funktionen.
Hur hanterar jag JavaScript-funktionen 'clearTimeout()'?
den ' clearTimeout ()'-funktionen avbryter tidsintervallet som tidigare ställts in med hjälp av ' setTimeout ()” funktion. den ' setTimeout ()”-funktionen ställer in tidsintervallet för att utföra en specifik uppgift upprepade gånger inom den.
Syntax
Arbetet med ' clearTimeout ()”-metoden beror på dess grundläggande syntax som är skriven nedan:
clearTimeout ( id_of_settimeout )
Enligt ovanstående syntax, ' clearTimeout ()' tar ' id ' av ' setTimeout ()”-funktionen och stoppar tidsintervallet. Om användaren inte skickar id:t utför den ingenting.
Låt oss implementera den ovan definierade funktionen genom att använda dess grundläggande syntax.
Exempel 1: Användning av funktionen 'clearTimeout()' för att stoppa det inställda tidsintervallet
Det första exemplet gäller ' clearTimeout ()” för att stoppa det inställda tidsintervallet.
Titta först på följande HTML-kod:
< Centrum >< sid > Vänta 2 sekunder, sidan kommer att visa en rubrik. < / sid >
< h2 id = 'H2' >< / h2 >
< knapp onclick = 'sluta()' > Stoppa avrättningen! < / knapp >
< / Centrum >
I ovanstående kodrader:
- Den '< Centrum >”-taggen ställer in justeringen av de givna HTML-elementen till mitten av webbsidan.
- Den '< sid >”-taggen anger en paragrafsats.
- Den '< h2 >'-taggen är ett tomt rubrikelement med ett id ' H2 ”.
- Den '< knapp >'-taggen infogar knappelementet som anropar ' sluta ()'-funktionen när den är ansluten ' onclick ” händelse utlöses.
Använd sedan ' clearTimeout ()” funktion med det angivna kodblocket:
< manus >konst Ställ klockan = setTimeout ( Start , 2000 ) ;
fungera Start ( ) {
dokumentera. getElementById ( 'H2' ) . innerHTML = 'Välkommen till Linuxhint!'
}
fungera sluta ( ) {
clearTimeout ( Ställ klockan ) ;
}
manus >
I kodavsnittet ovan:
- den ' Ställ klockan variabeln tillämpar setTimeout ()'-funktionen som skickar ' Start ' fungerar som dess första parameter och den angivna ' antal millisekunder ” som den andra parametern. Denna funktion utför ' Start ”-funktion i ett angivet tidsintervall.
- Därefter definierar du ' Start ()” funktion.
- I den här funktionen är ' document.getElementById ()'-metoden används för att komma åt det tomma rubrikelementet vars id är ' H2 ” och lägg till den med den givna textsatsen.
- Efter det kommer ' sluta ()'-funktionen är definierad, som tillämpar ' clearTimeout ()'-metoden som skickar id:t för ' setTimeout ()” för att stoppa dess tidsintervall.
Utdata (före stoppkörning)
Nu visar utgången ett rubrikelement i ett specificerat tidsintervall innan tidsintervallet som ställts in via ' setTimeout ()”-metoden.
Utdata (efter stoppkörning)
Det givna knappklicket stoppar tidsintervallet som har ställts in för att visa rubrikelementet.
Exempel 2: Användning av funktionen 'clearTimeout()' för att stoppa en funktion
Detta exempel använder ' clearTimeout ()” funktion för att stoppa exekveringen av en funktion:
Gå först igenom den medföljande HTML-koden:
< Centrum >< knapp onclick = 'Start()' > Börja räkna! < / knapp >
< inmatning typ = 'text' id = 'fält' >
< knapp onclick = 'sluta()' > Sluta räkna! < / knapp >
< / Centrum >
I ovanstående kodblock:
- Den '< knapp >'-taggen bifogar ' onclick ” händelse för att anropa funktionen “start()” när den klickas.
- Den '< inmatning >'-taggen lägger till ett inmatningsfält med typen ' text ' och ett id 'fält'.
- Nästa '< knapp >' bifogar också ' onclick ' händelse för att ringa ' sluta ()”-funktionen när denna händelse utlöses.
Använd nu ' clearTimeout ()”-funktionen med hjälp av dessa kodrader:
< manus >låt motverka = 0 ;
låt ställa in tid ;
låt timer_på = 0 ;
fungera räkna ( ) {
dokumentera. getElementById ( 'fält' ) . värde = disken ;
disken ++;
Ställ klockan = setTimeout ( räkna , 1000 ) ;
}
fungera Start ( ) {
om ( ! Timer On ) {
Timer On = 1 ;
räkna ( ) ;
}
}
fungera sluta ( ) {
clearTimeout ( Ställ klockan ) ;
Timer On = 0 ;
}
manus >
I kodraderna ovan:
- För det första, ' låta ' nyckelord deklarerar tre variabler ' räknare”, “setTime” och “timer_on ”.
- Därefter ' räkna ()”-funktionen är definierad.
- I sina definitioner, ' document.getElementById() ”-metoden används för att komma åt det tillagda inmatningsfältet med dess id ” fält ' och lägg till det med värdet av ' disken ” variabel.
- Öka nu värdet på ' disken ” variabel.
- Till sist, använd ' setTimeout ()'-metoden för att utföra exekveringen av ' räkna ()”-funktionen i ett givet tidsintervall.
- Efter det, definiera en funktion som heter ' Start ()”.
- I den här funktionen är en ' om ”-sats används som anger ett villkor, dvs om ” imer_on ' är inte ' på ' då är det lika med ' 1 ' och den ' räkna ()”-funktionen anropas.
- Nu är en annan funktion definierad som heter ' sluta ()”.
- I sin definition är ' clearTimeout ()'-metoden används genom att passera id:t för ' setTimeout ()”-metoden, dvs. Ställ klockan ”.
Produktion
Det kan observeras att ' Starträkning ”-knappen startar räkningen som ökar efter var 1:e sekund. Denna räkning stoppas genom att klicka på ' Sluta räkna! ' knapp.
Det handlar om att hantera clearTimeout()-funktionen i JavaScript.
Slutsats
den ' clearTimeout ()'-funktionen hanterar tidsintervallet som anges med hjälp av ' setTimeout ()”-funktionen. Den utför denna uppgift genom att skicka ID:t för 'setTimeout()' fungera som dess väsentliga parameter. Den används för att avbryta de uppgifter som utförs inom det angivna tidsintervallet som har ställts in med ' setTimeout ()”-funktionen. Det här inlägget har praktiskt förklarat proceduren för att hantera JavaScript clearTimeout()-funktionen.