JavaScript tanfolyam

3. rész

Az Ön gépe szerint a pontos idő:

Leckénk célja, hogy az itt látható óra fabrikálásának titkát megtudjuk.

Egy űrlapot hozunk létre, melynek input mezőjében jelenik meg az óra. Ennek az a magyarázata, hogy az input mező azon kevés objektumok egyike, amit a JavaScript segítségével mind az Explorerben mind a Netscapeben át lehet írni. Ezen űrlap kódját láthatjuk itt:

<center>
<form NAME="OraUrlap">
<b>Az Ön gépe szerint a pontos ido:</b>
 <INPUT TYPE="text" NAME="kijelzo" SIZE=9 VALUE="">
</form>
</center>

Az alábbi függvény végzi a mező frissítését:

<head>
<script LANGUAGE="JavaScript">

function JavasScriptOra() { var ido = new Date() var ora = ido.getHours() var perc = ido.getMinutes() var masodperc = ido.getSeconds() var kiir = "" + ora + ":" kiir += ((perc < 10) ? "0" : "") + perc + ":" kiir += ((masodperc < 10) ? "0" : "") + masodperc document.OraUrlap.kijelzo.value = kiir id = setTimeout("JavasScriptOra()",1000) } </script> </head>

A függvényt a fejlécben kell elhelyeznünk. Az ido nevu változó az alábbi módon veszi fel az aktuális dátum értékét:

var ido = new Date()

Az ora változóba az óra értékét az alábbi módon tesszük:

var ora = ido.getHours()

Hasonlóképpen kapjuk meg a perceket és másodperceket. A kiir változóba a kiíratni kívánt szöveget tesszük. A képletet a "" szimbólummal kezdjük, ami egy nulla hosszúságú karaktert ad, de jelzi, hogy nem számmal, hanem szöveggel van dolgunk így a + karakter nem összeadást, hanem karakterösszefüzést jelent. Az a += b formula az a = a + b formulát rövidíti. (C-ben ez bevett szokás.)

Az ((a < b) ? "c" : "d") azt jelenti, hogy ha a teljesül, akkor c, ha nem akkor d. Esetünkben:

 ((perc < 10) ? "0" : "") + perc

az egyjegyu percek elé betesz egy 0-t. Így kapunk mindig kétjegyu számot.
Az document.OraUrlap.kijelzo.value = kiir formula nagyon fontos. A documentum nevu objektumnak van egy OraUrlap névre hallgató objektuma. (Így neveztük el az urlapot.) Azon van egy kijelzo nevu objektum - az írni kívánt mezo. Ennek az értékét (value) tesszük egyenlové a kiir változó értékével.
Az

 
id = setTimeout("JavasScriptOra()",1000)

egy rekurzív trükk. A

 setTimeout(f(),x)

utasítás az f() függvényt hívja meg x ezred másodpercnyi idő múlva. Jelen esetben a függvény önmagát hívja meg - 1 másodpercenként.

Gyakorlásként egy könnyebben kivitelezhető példát nézzünk meg, amely a feltételes utasításokat beágyazva tartalmazza. A nyomógombot megnyomva a napszaknak megfelelő köszönést végez programunk.

A forrás:


<SCRIPT language="JavaScript">
function Napszak() {
          var ido = new Date()
          var ora = ido.getHours()
          var kiir = "Jó" +((ora > 19) ? " estét" : ((ora > 8) ? " napot" : ((ora > 3) ? " reggelt" : " estét"))) 	+  "!"
          document.Ora2Urlap.kijelzo.value = kiir
}
</SCRIPT>

<center>
<FORM NAME="Ora2Urlap">
<input type="button" value="Nyomd meg ezt a gombot!"  
onclick="Napszak()">
<INPUT TYPE="text" NAME="kijelzo" SIZE=15 VALUE="">
</FORM>
</center>

Innen folytatjuk...