Nag-aalok ang JavaScript ng isang paunang natukoy na ' clearTimeout ()” na paraan na namamahala sa paggana ng time-out. Nagbibigay-daan ito sa mga user na kanselahin ang agwat ng oras na dati nang itinatag ng ' setTimeout ()” function. Ihihinto nito ang pagpapatupad ng bloke ng code na umuulit pagkatapos ng tiyak na agwat ng oras. Ito ay kadalasang ginagamit para sa mga website ng pagbabangko at e-commerce upang kanselahin ang mga naka-iskedyul na gawain.
Ipapaliwanag ng post na ito kung paano pangasiwaan ang function ng JavaScript clearTimeout().
Paano Pangasiwaan ang JavaScript 'clearTimeout()' Function?
Ang ' clearTimeout ()' function na kinakansela ang agwat ng oras na naunang itinakda sa tulong ng ' setTimeout ()” function. Ang ' setTimeout ()' function ay nagtatakda ng agwat ng oras upang maisagawa ang isang tiyak na gawain nang paulit-ulit sa loob nito.
Syntax
Ang paggawa ng ' clearTimeout ()' na paraan ay depende sa pangunahing syntax nito na nakasulat sa ibaba:
clearTimeout ( id_of_settimeout )
Ayon sa syntax sa itaas, ang ' clearTimeout ()' kumukuha ng ' id 'ng' setTimeout ()” function at huminto sa pagitan ng oras. Kung hindi naipasa ng user ang id, wala itong gagawin.
Ipatupad natin ang function na tinukoy sa itaas sa pamamagitan ng paggamit ng pangunahing syntax nito.
Halimbawa 1: Paglalapat ng “clearTimeout()” na Function para Ihinto ang Set Time Interval
Ang unang halimbawa ay inilalapat ang ' clearTimeout ()” function upang ihinto ang nakatakdang agwat ng oras.
Tingnan muna ang sumusunod na HTML code:
< gitna >< p > Maghintay ng 2 segundo, ang pahina ay magpapakita ng isang heading. < / p >
< h2 id = 'H2' >< / h2 >
< pindutan onclick = 'stop()' > Itigil ang Pagbitay! < / pindutan >
< / gitna >
Sa mga linya ng code sa itaas:
- Ang '< gitna >' itinatakda ng tag ang pagkakahanay ng mga ibinigay na elemento ng HTML sa gitna ng web page.
- Ang '< p >” tag ay tumutukoy sa isang talata na pahayag.
- Ang '< h2 > Ang tag ay isang walang laman na elemento ng heading na may id na ' H2 ”.
- Ang '< pindutan >' ilalagay ng tag ang elemento ng button na tumatawag sa ' huminto ()' function kapag ito ay nakalakip na ' onclick ” na-trigger ang kaganapan.
Susunod, ilapat ang ' clearTimeout ()” function gamit ang nakasaad na code block:
< script >const setTime = setTimeout ( simulan , 2000 ) ;
function simulan ( ) {
dokumento. getElementById ( 'H2' ) . innerHTML = 'Maligayang pagdating sa Linuxhint!'
}
function huminto ( ) {
clearTimeout ( setTime ) ;
}
script >
Sa snippet ng code sa itaas:
- Ang ' setTime Inilalapat ng variable ng ” ang “ setTimeout ()' function na pumasa sa ' simulan ” function bilang unang parameter nito at ang tinukoy na “ bilang ng milliseconds ” bilang pangalawang parameter. Isinasagawa ng function na ito ang ' simulan ” function sa isang tinukoy na agwat ng oras.
- Susunod, tukuyin ang ' simulan ()” function.
- Sa function na ito, ang ' document.getElementById ()' na pamamaraan ay inilapat upang ma-access ang walang laman na elemento ng heading na ang id ay ' H2 ” at dugtungan ito ng ibinigay na text statement.
- Pagkatapos nito, ang ' huminto ()' function ay tinukoy, na nalalapat ang ' clearTimeout ()' na paraan na nagpapasa ng id ng ' setTimeout ()” function upang ihinto ang agwat ng oras nito.
Output(Bago Ihinto ang Pagpapatupad)
Ngayon ang output ay nagpapakita ng isang elemento ng heading sa isang tinukoy na agwat ng oras bago ihinto ang agwat ng oras na itinakda sa pamamagitan ng ' setTimeout ()” paraan.
Output(Pagkatapos Ihinto ang Pagpapatupad)
Ang ibinigay na pag-click sa pindutan ay humihinto sa pagitan ng oras na itinakda para sa pagpapakita ng elemento ng heading.
Halimbawa 2: Paglalapat ng “clearTimeout()” na Function upang Ihinto ang isang Function
Ang halimbawang ito ay gumagamit ng ' clearTimeout ()” function upang ihinto ang pagpapatupad ng isang function:
Una, dumaan sa ibinigay na HTML code:
< gitna >< pindutan onclick = 'simula()' > Simulan ang bilang! < / pindutan >
< input uri = 'text' id = 'patlang' >
< pindutan onclick = 'stop()' > Stop count! < / pindutan >
< / gitna >
Sa itaas na bloke ng code:
- Ang '< pindutan >' ang tag ay nakakabit sa ' onclick ” event upang i-invoke ang function na “start()” kapag na-click ito.
- Ang '< input >' nagdaragdag ang tag ng input field na may uri na ' text ” at isang id na “field”.
- Ang susunod na '< pindutan >' ikinakabit din ang ' onclick 'kaganapang tatawagin ang' huminto ()” function kapag na-fire ang event na ito.
Ngayon, ilapat ang ' clearTimeout ()' gamit ang mga linya ng code na ito:
< script >hayaan ang counter = 0 ;
hayaan ang setTime ;
hayaan ang timer_on = 0 ;
function bilangin ( ) {
dokumento. getElementById ( 'patlang' ) . halaga = counter ;
counter ++;
setTime = setTimeout ( bilangin , 1000 ) ;
}
function simulan ( ) {
kung ( ! timer_on ) {
timer_on = 1 ;
bilangin ( ) ;
}
}
function huminto ( ) {
clearTimeout ( setTime ) ;
timer_on = 0 ;
}
script >
Sa mga linya ng code sa itaas:
- Una, ang ' hayaan 'nagdedeklara ang keyword ng tatlong variable' counter', 'setTime', at 'timer_on ”.
- Susunod, ang ' bilangin ()” function ay tinukoy.
- Sa mga kahulugan nito, ang ' document.getElementById() Inilapat ang pamamaraan upang ma-access ang idinagdag na field ng input gamit ang id nito ' patlang ” at dugtungan ito ng halaga ng “ counter ” variable.
- Ngayon, dagdagan ang halaga ng ' counter ” variable.
- Panghuli, ilapat ang ' setTimeout ()' na paraan upang maisagawa ang pagpapatupad ng ' bilangin ()” function sa isang naibigay na agwat ng oras.
- Pagkatapos nito, tukuyin ang isang function na pinangalanang ' simulan ()”.
- Sa function na ito, isang ' kung 'Ang pahayag ay ginagamit na tumutukoy sa isang kundisyon i.e. kung ' imer_on ' ay hindi ' sa 'pagkatapos ito ay katumbas ng' 1 ' at ang ' bilangin ()” function ay tinatawag.
- Ngayon, ang isa pang function ay tinukoy na pinangalanang ' huminto ()”.
- Sa kahulugan nito, ang ' clearTimeout ()' na pamamaraan ay inilapat sa pagpasa sa id ng ' setTimeout ()' paraan i.e. ' setTime ”.
Output
Mapapansin na ang ' Simulan ang bilang Sinisimulan ng button na ” ang bilang na tumataas pagkatapos ng bawat 1 segundo. Ang bilang na ito ay humihinto sa pamamagitan ng pag-click sa “ Stop count! ” button.
Iyon lang ang tungkol sa paghawak ng clearTimeout() function sa JavaScript.
Konklusyon
Ang ' clearTimeout ()' function na pinangangasiwaan ang agwat ng oras na tinukoy sa tulong ng ' setTimeout ()” function. Ginagawa nito ang gawaing ito sa pamamagitan ng pagpasa ng id ng 'setTimeout()' function bilang mahalagang parameter nito. Ginagamit ito para sa pagkansela ng mga gawaing isinagawa sa tinukoy na agwat ng oras na itinakda gamit ang ' setTimeout ()” function. Ang post na ito ay praktikal na ipinaliwanag ang pamamaraan upang mahawakan ang JavaScript clearTimeout() function.