JavaScript offre un ' clearTimeout ()” che gestisce la funzionalità di timeout. Permette di annullare l'intervallo di tempo precedentemente stabilito dal “ setTimeout ()' funzione. Arresta l'esecuzione del blocco di codice che si ripete dopo l'intervallo di tempo specifico. Viene utilizzato principalmente per i siti Web bancari ed e-commerce per annullare le attività pianificate.
Questo post spiegherà come gestire la funzione JavaScript clearTimeout().
Come gestire la funzione JavaScript “clearTimeout()”?
IL ' clearTimeout ()” cancella l’intervallo di tempo precedentemente impostato con l’aiuto del tasto “ setTimeout ()' funzione. IL ' setTimeout ()” imposta l'intervallo di tempo per eseguire ripetutamente un'attività specifica al suo interno.
Sintassi
Il funzionamento del “ clearTimeout ()” dipende dalla sua sintassi di base scritta di seguito:
clearTimeout ( id_of_settimeout )
Secondo la sintassi di cui sopra, il ' clearTimeout ()” prende il “ id ' del ' setTimeout ()” e interrompe l'intervallo di tempo. Se l'utente non trasmette l'ID, non esegue nulla.
Implementiamo la funzione sopra definita utilizzando la sua sintassi di base.
Esempio 1: applicazione della funzione “clearTimeout()” per interrompere l'intervallo di tempo impostato
Il primo esempio applica il “ clearTimeout ()” per interrompere l'intervallo di tempo impostato.
Per prima cosa guarda il seguente codice HTML:
< centro >< P > Attendere 2 secondi, la pagina visualizzerà un'intestazione. < / P >
< h2 id = 'H2' >< / h2 >
< pulsante al clic = 'fermare()' > Interrompi l'esecuzione! < / pulsante >
< / centro >
Nelle righe di codice sopra:
- Il “< centro >” imposta l'allineamento degli elementi HTML specificati al centro della pagina web.
- Il “< P >” specifica un'istruzione di paragrafo.
- Il “< h2 >' il tag è un elemento di intestazione vuoto con un ID ' H2 ”.
- Il “< pulsante >' inserisce l'elemento pulsante che richiama il ' fermare ()” funzione quando è allegato “ al clic ' l'evento viene attivato.
Successivamente, applica il ' clearTimeout ()” utilizzando il blocco di codice indicato:
< sceneggiatura >cost setTime = setTimeout ( inizio , 2000 ) ;
funzione inizio ( ) {
documento. getElementById ( 'H2' ) . innerHTML = 'Benvenuti in Linuxhint!'
}
funzione fermare ( ) {
clearTimeout ( setTime ) ;
}
sceneggiatura >
Nello snippet di codice sopra:
- IL ' setTime La variabile ' applica la variabile ' setTimeout ()” funzione che passa il “ inizio ' funziona come primo parametro e il ' numero di millisecondi ' come secondo parametro. Questa funzione esegue il “ inizio ” funziona in un intervallo di tempo specificato.
- Successivamente, definire il ' inizio ()' funzione.
- In questa funzione, il “ document.getElementById ()' viene applicato per accedere all'elemento di intestazione vuoto il cui ID è ' H2 ' e aggiungilo con l'istruzione di testo specificata.
- Dopodiché, il “ fermare ()” è definita la funzione “ clearTimeout ()” metodo che passa l'id del “ setTimeout ()” per interrompere l'intervallo di tempo.
Output (prima dell'arresto dell'esecuzione)
Ora l'output mostra un elemento di intestazione in un intervallo di tempo specificato prima di interrompere l'intervallo di tempo impostato tramite ' setTimeout ()' metodo.
Uscita (dopo l'esecuzione dell'arresto)
Il clic del pulsante specificato interrompe l'intervallo di tempo impostato per la visualizzazione dell'elemento dell'intestazione.
Esempio 2: applicazione della funzione “clearTimeout()” per arrestare una funzione
Questo esempio utilizza il ' clearTimeout ()” per interrompere l'esecuzione di una funzione:
Innanzitutto, esamina il codice HTML fornito:
< centro >< pulsante al clic = 'inizio()' > Inizia a contare! < / pulsante >
< ingresso tipo = 'testo' id = 'campo' >
< pulsante al clic = 'fermare()' > Smettila di contare! < / pulsante >
< / centro >
Nel blocco di codice sopra:
- Il “< pulsante >' il tag allega il ' al clic ' per richiamare la funzione 'start()' quando viene fatto clic.
- Il “< ingresso >' aggiunge un campo di input con il tipo ' testo ' e un id 'campo'.
- Il successivo “< pulsante >” allega inoltre il “ al clic ' evento per chiamare il ' fermare ()” quando viene attivato questo evento.
Ora applica il ' clearTimeout ()” utilizzando queste righe di codice:
< sceneggiatura >lasciamo contrastare = 0 ;
let setTime ;
lascia che timer_on = 0 ;
funzione contare ( ) {
documento. getElementById ( 'campo' ) . valore = contatore ;
contatore ++;
setTime = setTimeout ( contare , 1000 ) ;
}
funzione inizio ( ) {
Se ( ! timer acceso ) {
timer acceso = 1 ;
contare ( ) ;
}
}
funzione fermare ( ) {
clearTimeout ( setTime ) ;
timer acceso = 0 ;
}
sceneggiatura >
Nelle righe di codice sopra:
- In primo luogo, il “ permettere 'la parola chiave dichiara tre variabili' contatore', 'setTime' e 'timer_on ”.
- Successivamente, il “ contare ()” è definita la funzione.
- Nelle sue definizioni, il “ document.getElementById() ' viene applicato il metodo per accedere al campo di input aggiunto utilizzando il suo ID ' campo ' e aggiungerlo con il valore di ' contatore 'variabile.
- Ora, incrementa il valore di “ contatore 'variabile.
- Infine, applicare il “ setTimeout ()” metodo per eseguire l’esecuzione del “ contare ()” in un dato intervallo di tempo.
- Successivamente, definisci una funzione denominata ' inizio ()”.
- In questa funzione, un “ Se Viene utilizzata l'istruzione ' che specifica una condizione, ad esempio if ' imer_on ' non è ' SU ' allora è uguale a ' 1 ' e il ' contare ()” viene richiamata la funzione.
- Ora viene definita un'altra funzione denominata ' fermare ()”.
- Nella sua definizione, il “ clearTimeout ()” viene applicato il metodo passando l'id del “ setTimeout ()” metodo cioè “ setTime ”.
Produzione
Si può osservare che “ Inizia il conteggio Il pulsante ' avvia il conteggio che aumenta ogni secondo. Questo conteggio si interrompe cliccando sul pulsante “ Smettila di contare! pulsante '.
Si tratta di gestire la funzione clearTimeout() in JavaScript.
Conclusione
IL ' clearTimeout ()” gestisce l'intervallo di tempo specificato con l'aiuto della funzione “ setTimeout ()' funzione. Esegue questo compito passando l'id del file “setTimeout()” funzione come parametro essenziale. Viene utilizzato per annullare le attività eseguite nell'intervallo di tempo specificato impostato utilizzando il pulsante ' setTimeout ()' funzione. Questo post ha praticamente spiegato la procedura per gestire la funzione JavaScript clearTimeout().