JavaScript Funktsioonid
JavaScript funktsioon on korduv-kasutusega koodide blokk mis käivitab sündmuse v. käivitatakse see külastaja poolt.
Näited
Funktsioon-1
Funktsioon-2
Funktsioon-3
Funktsioon-4
Funktsioon-5
JavaScript Funktsioonid
Funktsioon sisaldab koodi mis võimaldab käivitada scripti siis kui käivtatakse vastav sündmus. Muul ajal on Script n.ö. uinuvas olekus.
Selleks, et vältida skripti käivitumist lehekülje allalaadimisel tuleb skript paigutada "head" sektsiooni ja siduda funktsiooniga.
Näide:
<html>
<head>
<script type="text/javascript">
function vajutamind()
{
alert("Tere Taas!");
}
</script>
</head>
</html>
</html>
<body>
<form>
<input type="button" value="Vajuta mind!"
onclick="vajutamind()" >
</form>
</body>
</html>
Tulemus peaks olema selline:
Ülalpool olevas näites öeldakse brauserile "function" sõna abil, kus kohas funktsioon asateseb. Seejärel antakse funktsioonile nimi. Antud juhul on see "vajutamind".
Loogelised sulud määravad funktsiooni koodi piirid.
Lisatud on "onclick" sündmus. S.t. et külastaja, vajutades nupule, käivitab funktsiooni mis omakorda käivitab koodi ning seejärel ilmub
ekraanile teateaken.
Kuidas Määratleda Funktsiooni
Süntaks:
function funktsiooninimi(var1,var2,...,varX)
{
mingi kood
}
Var1, var2 jne. on muutjad v. väärtused mis läbivad funktsiooni. See v. need määravad, kus kohas on funktsiooni algus ja lõpp.
Pane tähele: Funktsioonil, millel puuduvad parameetrid, peavad olema lisatud sulud () funktsiooni nime järel:
Pane tähele: Funktsiooni kood peab jääma loogeliste sulgude {} vahele.
Pane tähele: Funktsioon ja tema nimi kirjutatakse alati väikeste tähtedega.
function funktsiooninimi()
{
mingi kood
}
Tagasituleku (return) Lausung
Seda lausungit kasutatakse määramaks väärtust, mille funktsioon saadab tagasi. Selleks, et funktsioon niimoodi toimiks, tuleb kasutada "return", lausungit.
Näide:
<script type='text/javascript'>
function isNumeric(elem, helperMsg){
var numericExpression = /^[0-9]+$/;
if(elem.value.match(numericExpression)){
return true;
}else{
alert(helperMsg);
elem.focus();
return false;
}
}
</script>
<form>
Ainult Numbrid: <input type='text' id='numbers'/>
<input type='button'
onclick="isNumeric(document.getElementById('numbers'),
'Palun Kirjuta Ainult Numbrid')"
value='Konrolli' />
</form>
Selline peaks olema tulemus:
Ülal toodud näites on kasutatud "return true;" lausungit. Lisatud on ka muutuja "alphaExp" koos väärtusega " /^[0-9]+$/;" (keelatud on nii suured kui ka väiksed tähed).
Seega sisestades tekstiväljale midagi muud peale numbrite, saadab (return) funktsioon pärast käivitamist tagasi väärtuse, teate-akna näol.
Hea Näpunäide
Selleks, et veebilehte mitte ülekoormata teisejärgulise informatsiooniga, saab kasutada JavaScript'i koodi. Näiteks saab mingile artiklile lisada informatsiooni nii, et ei kasutata Html "ankur" elementi, vaid skripti mille tulemusel saab "PopUp" akna. Selle akna sisuks võib olla ükskõik milline veebidokument, mis sisaldab lisainformatsiooni, eelpool mainitud artikli kohta.
Näide:
<head>
<script type="text/javascript">
<!--
function minuPopup() {
window.open( "https://pyramdesign.angelfire.com/
javascript_sissejuhatus.html/", "myWindow",
"status = 1, height = 300, width = 300, resizable = 0" )
}
//-->
</script>
</head>
<body>
<form>
<input type="button" onClick="myPopup()" value="POP!">
</form>
<p onClick="myPopup()">KLIKI SIIA KA!</p>
</body>
Selline peaks olema tulemus:
|
KLIKI SIIA KA! |
