Javascript Timer Tutorial

Skapa en webbsida som uppdateras efter varje några minuter kräver användning av JavaScript . Med JavaScript , kan du ställa in en sida för att uppdatera efter ett visst tidsintervall och visar en timer som visar när nästa uppdatering kommer att ske . Du kan också skapa tidsinställda händelser att springa eller slinga vid fördefinierade tider och synkronisera flera händelser på en tidslinje . Timing händelser i Javascript görs med " setTimeout ( ) " metoden , som exekverar en kod vid en inställd tidpunkt i framtiden och " clearTimeout ( ) , " som avbryter setTimeout ( ) metoden . Instruktioner
1

Skapa en knapp i din HTML- sida som heter " Klick " enligt nedan :

< input type = " button" name = " Klicka på " value = "Klicka och vänta " onclick = Timer ( ) " />
2

Infoga en funktion kod i huvudet på HTML-sidan i det format som visas nedan :

< script type = " text /javascript " > var s , var t = 0; var time_on , funktion Timer ( ) {var s = setTimeout ( " alert ( '5 sekunder ' ) ! " , 10000 ) ; } < /script >

När knappen märkt " Click" klickas, setTimeout ( ) anropas metoden och ett pop up-meddelande visas på ditt fönster med meddelandet " Surprise " efter 10 sekunder eller 10.000 millisekunder .

3

Skriv in koden för att avbryta timern innan den slocknar med följande syntax :

clearTimeout ( timeoutId ) ;

" timeoutId " parametern är timeout återvänt från tidigare " . setTimeout ( )-metodanrop
4

Skriv " StopCount " funktion enligt nedan :

AlertID = 0 ;

funktion StopCount ( ) {if . . ( document.getElementById ( " alertTimer " ) value == " ! Klicka och vänta " {

document.getElementById ( " alertTimer " ) value = " Klicka för att stoppa ! " , alertID = setTimeout ( " showAlert ( ) " , 2000) ; } else {

document.getElementById ( " alertTimer " ) värde = . " Klicka och vänta " , ! clearTimeout ( alertTimerId ) ;} }

funktion showAlert ( ) {

alert ( " för sent att stoppa timer ! " ) ; document.getElementById ( " alertTimer " ) value = " Klicka och vänta ! "; . }
5

Copy följande kod på din html- dokument :

Addera