Hvordan Count Down Bruke Javascript

Hvordan Count Down Bruke Javascript


Javascript ble utviklet av Netscape som et verktøy for å gjøre nettsteder mer interaktive og engasjerende. Betraktet i utgangspunktet av noen som en "leketøy" språk, er Java få anerkjennelse som et uunnværlig verktøy for å lage web-applikasjoner, sosiale medier nettsteder og mobile applikasjoner. Et eksempel på Javascript makt ligger i dens system tids metoder. De setTimeout () og setInterval () metoder utløse hendelser etter en forhåndsdefinert tidsperiode har gått. Når setTimeout () kalles, utfører den en gang arbeidet i bakgrunnen. Den setInterval () -funksjonen, men vil fortsette å utløse den samme hendelsen om og om igjen til den er stoppet av clearInterval () -metoden.

Bruksanvisning

1 Start standard, ren tekst editor program som er tilgjengelig på datamaskinen.

2 Skriv inn følgende kode inn i teksteditor:

<Html>

<Head>

<Script type = "text / javascript">

Var fullcount = 10;

Var Starttime = fullcount;

Var quitIt = 0;

funksjon mytimer ()

{

document.getElementById ( "teller") innerhtml = starttid.;

. Document.getElementById ( "MyButton") value = "Counting";

quitIt = setInterval ( "changeDiv ()", 1000);

}

fungere changeDiv ()

{

startTime=startTime-1;

document.getElementById ( "teller") innerhtml = starttid.;

if (Starttime == 0)

{

clearInterval (quitIt);

. Document.getElementById ( "MyButton") value = "Count er gjort";

Starttime = fullcount;

}

}

</ Script>

</ Head>

<Body>

<H1> Nedtelling </ h1>

<Input id = "MyButton" type = "button" value = "Starte nedtellingen" onclick = "mytimer ()" />

<h1 id = "count"> </ h1>

</ Body>

</ Html>

3 Klikk på Fil-menyen. Velg "Lagre" alternativet. Lagre under filnavnet "test.html."

4 Start nettleseren som er tilgjengelig på datamaskinen. Klikk på "File" menyen og velg "Åpne fil".

5 Finn filen "test.html" du opprettet, og klikk deretter på "Open".

Hint

  • Eksempelet som følger med denne artikkelen vil begynne nedtellingen hver gang brukeren klikker på knappen. For å deaktivere knappen, kan du legge til kommandoen document.getElementById ( "MyButton"). Onclick = "" ;. Dette vil fjerne onclick () hendelse fra timeren. Her er den nye changeDiv () -funksjonen:
  • fungere changeDiv ()
  • {
  • Starttime = Starttime-1;
  • document.getElementById ( "teller") innerhtml = starttid.;
  • if (Starttime == 0)
  • clearInterval (quitIt);
  • . Document.getElementById ( "MyButton") value = "Count er gjort";
  • . Document.getElementById ( "MyButton") onclick = "";
  • }
  • Javascript er et case-sensitive programmeringsspråk. Variablene "Cshell" og "CShell" anses unik av tolk. På den annen side, er HTML små bokstaver. Anta at det er en HTML-uttalelse:
  • "<Input type =" button "onClick () =" somefunction () "value =" klikk ">".
  • I HTML-kode, både "onclick ()" og "onClick ()" vil utføre en Javascript-funksjon. Når en Javascript-metode forsøker å endre onclick () hendelse, derimot, må den bruke samme sak som brukes i HTML-koden. Javascript statement "document.getElementById ( 'MyButton') onclick = '';." Vil mislykkes i å inaktivere knappen fordi saken ikke samsvarer med HTML-kode.