La prossima volta che una delle pagine Web della società deve eseguire un’attività dopo un determinato intervallo di tempo, incorporare un timer per il conto alla rovescia in quella pagina. Le persone che hanno familiarità con i lanci di razzi comprendono la metafora trasmessa dai timer per il conto alla rovescia. Se hai un’offerta valida per 30 secondi, ad esempio, potresti aggiungere un timer per il conto alla rovescia alla tua pagina Web che mostra i secondi mentre scorrono.
1
Avvia il tuo editor HTML e apri un documento HTML.
2
Incolla il codice elencato di seguito nella sezione del documento in cui desideri che appaia il conto alla rovescia:
secondi:
Il codice crea una casella di testo e un pulsante che puoi utilizzare per testare la funzione che esegue il conto alla rovescia dei secondi. L’evento onclick del pulsante chiama la funzione tick e gli passa la parola “init” e il valore 10.
3
Aggiungi il seguente codice JavaScript alla sezione del documento:
var displayFieldID = “text1”; var seconds; erano ore;
La variabile displayFieldID contiene l’ID della casella di testo definita nella sezione del documento.
4
Incolla il codice mostrato di seguito dopo il codice mostrato nel passaggio precedente:
funzione tick (action, initialValue) {if (action == “init”) seconds = initialValue; document.getElementById (displayFieldID) .value = secondi; secondi – = 1; if (secondi> -1) {timer = setTimeout (“tick ()”, 1000); } else {alert (“Time is up”); }}
Questa funzione tick, chiamata quando si fa clic sul pulsante del documento, accetta un parametro denominato action e un altro denominato initialValue. Poiché l’evento clic sul pulsante trasmette “init” e 10 come quei valori, le variabili action e initialValue avranno quei valori. Le restanti righe di codice sottraggono 1 dal valore memorizzato in intialValue e visualizzano il risultato nella casella di testo. La funzione setTimeout chiama di nuovo la funzione tick se il numero di secondi rimanenti è maggiore di -1.
5
Salva il documento e visualizzalo in un browser. Digita il numero di secondi che desideri contare nella casella di testo “Secondi” e fai clic su “Avvia conto alla rovescia”. Il codice viene eseguito e conta alla rovescia i secondi.