Vai al contenuto
Home » Notes » Come fare un semplice conto alla rovescia in JavaScript JS

Come fare un semplice conto alla rovescia in JavaScript JS

come fare un conto alla rovescia in javascript puro tutorial con codice

Se stai realizzando un progetto con JavaScript o stai studiando il linguaggio, potrebbe servirti un esempio di countdown in JavaScript. Ecco una piccola guida su come fare un semplice conto alla rovescia personalizzato con Javascript. Ti mostrerò e analizzeremo un countdown fatto con JS puro, senza l’uso di alcun framework.


Il countdown che vogliamo realizzare è questo:

Parti da:

secondi

X

L'utente può selezionare un numero di secondi dal quale far partire il countdown e premendo il tasto avvia, parte il conto alla rovescia che viene mostrato a schermo. Al raggiungimento dello 0 il countdown termina.


Countdown - Conto alla rovescia in JavaScript

Tutto ciò che dobbiamo creare è:

  • una casella di testo in HTML per l'inserimento dei secondi del countdown
  • un pulsante in HTML per avviare il countdown ovvero per chiamare una funzione avvia()
  • una funzione in JS avvia() che una volta al secondo decrementi il numero di secondi rimasti, aggiorni un elemento del DOM per mostrare i secondi rimanenti e una volta arrivata a zero, termini.

Codice esempio conto alla rovescia in JavaScript:

la funzione clearInterval() permette di cancellare l'intervallo di una funzione che si ripete. Nel nostro caso la funzione avvia() che si ripeteva ogni 1000ms viene terminata. Il suo "contrario" è la funzione setInterval() che permette eseguire una chiamata ad una certa funzione ad ogni intervallo temporale fissato.

Altre guide su Javascript qui!

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *