Javascript

Download as doc, pdf, or txt
Download as doc, pdf, or txt
You are on page 1of 25

JAVA SCRIPT

SADRŽAJ

1 Model objekata dokumenta.............................................................................................3


2 Alert, Confirm, Prompt....................................................................................................4
3 Skript za konverziju....................................................................................................... 4
4 Dropdown meni.............................................................................................................. 5
5 Prikaz vremena............................................................................................................... 6
6 Browser, Operativni sistem, Url......................................................................................6
7 Vest koja se pomera.......................................................................................................6
8 Muzika na stranici........................................................................................................... 6
9 Mouse – over and out.....................................................................................................7
10 Slike Slideshow.............................................................................................................. 7
11 Window open, close, blur focus, assign, replace, status back i sl…...............................8
12 Blokiraj posetioce sa određenog domena.......................................................................8
13 Tooltip............................................................................................................................. 9
14 Promena boje pozadine................................................................................................10
15 Favour icon...................................................................................................................10
16 Zabrani desni klik.......................................................................................................... 10
17 Dodavanje sajta u bookmarks.......................................................................................11
18 Zoom picture................................................................................................................. 11
19 Mini kalkulator............................................................................................................... 12
20 Meni.............................................................................................................................. 13
21 Najjednostavniji meni....................................................................................................15
22 Meni 1........................................................................................................................... 16
23 Meni sa tabovima......................................................................................................... 18
24 Forma – ceo primer......................................................................................................20
25 Cookie – brojač poseta.................................................................................................23
26 Cookie – primer 2......................................................................................................... 23
27 Cookie Remember me..................................................................................................24

2
Model objekata dokumenta

Slika 1 Model objekata dokumenta

3
Alert, Confirm, Prompt

<script language="JavaScript">
var pomocna=confirm("Da li Vam se svidja predmet Internet
tehnologije ?");
if (pomocna==true)
alert("Odlicno")
else
alert("Promasili ste smer")
var ime=prompt("Kako se zovete","***")
alert("Postovani " + ime+ ", "+ "ovo je primer za metode objekta
window");
</script>

1 Skript za konverziju

<html>
<head>
<title>Konverzija</title>
</head>
<body>
<form name="promena">
<input type=text name="KB" size="16">KB
<BR>
<input type=button name="dugme" value=" < > "
onClick="convertuj()">
<BR>
<input type=text name="MB" size="16">MB
<BR>
<input type=reset value=" Obrisi ">
</form>
<SCRIPT LANGUAGE="JavaScript">
function convertuj() {
if(document.promena.KB.value) {
document.promena.MB.value = eval(document.promena.KB.value / 1024);
}
else {
if(document.promena.MB.value) {
document.promena.KB.value = eval(document.promena.MB.value * 1024);
}
}
}
</SCRIPT>
</body>
</html>

4
Dropdown meni

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"


"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1" />
<title>Meni</title>
<SCRIPT Language="JavaScript">

function ucitajmeni(meni){
location.href = meni.options[meni.selectedIndex].value
}
</SCRIPT>
</head>
<body>
<FORM>
<FONT SIZE=4>
<P>&nbsp;&nbsp;
<SELECT NAME="Meni" SIZE=4>
<OPTION VALUE="http://www.myelab.net">Myelab</OPTION>
<OPTION VALUE="http://www.fon.rs">FON</OPTION>
<OPTION VALUE="http://www.google.com">Google</OPTION>
<OPTION VALUE="http://www.yahoo.com">Yahoo</OPTION>
<OPTION VALUE="">Sesta opcija</OPTION>
</SELECT>
</FONT>
<BR><BR>&nbsp;&nbsp;&nbsp;
<INPUT TYPE=BUTTON VALUE="Izaberi opciju"
onClick = "ucitajmeni(this.form.Meni)">
</FORM>

</body>
</html>

5
Prikaz vremena

<script language=JavaScript>
var today=new Date()
var h=today.getHours()
var m=today.getMinutes()
var s=today.getSeconds()
// dodati 0 ispred brojeva manjih od 10
m=checkTime(m)
s=checkTime(s)
document.write("<FONT face=impact size=6 >"+h+":"+m+":"+s+"</font></a>");
function checkTime(i)
{
if (i<10)
{i="0" + i}
return i
}
</script>

Browser, Operativni sistem, Url

<script language=JavaScript>
document.write("Vas browser je " + window.navigator.appName +"<br>");
document.write("Verzija " + window.navigator.appVersion + "<br>");
document.write("Operativni sistem " + window.navigator.platform
"<br>");
document.write("Trenutna URL adresa: +window.location.href);
</script>

Vest koja se pomera

<script>
vest = "Najnovije vesti";
document.write ("<bold><font size=6>"+"<MARQUEE BEHAVIOR=ALTERNATE
direction=right>"+vest+"</MARQUEE></bold>")
</script>

Muzika na stranici

<script language="javascript">
document.write('<embed width=0 height=0 hidden="true" autostart="true"
volume="5" loop="false" src="pesma.mp3">');
</script>

6
Mouse – over and out

<html>
<head>
<script language=JavaScript>
function over(){
document.slika.src="slika3.jpg" }
function out(){
document.slika.src="slika2.jpg" }
</script>
</head>
<body>
<img src="slika1.jpg" name="slika" height=200 width=200 border=1
onmouseover="over()"; onmouseout="out()">
</body>
</html>

Slike Slideshow

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"


"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1" />
<title>Untitled Document</title>
<script>

NewImg= new Array( "slika1.jpg", "slika2.jpg", "slika3.jpg");


var ImgNum = 0;
var ImgLength = NewImg.length - 1;
function izmenisliku(direction) {
if (document.images) {
ImgNum = ImgNum + direction;
if (ImgNum > ImgLength) { ImgNum = 0; }
if (ImgNum < 0) { ImgNum = ImgLength; }
document.slideshow.src = NewImg[ImgNum];
}
}
</script>
</head>
<body>
<img src="slika1.jpg" height=200 width=300 name="slideshow">
<a href="javascript:izmenisliku(-1)" style="font-weight: bold; font-size:
14pt; width: 150px; color: #000099; background-color: #ffff99" ><&nbsp;
PREVIOUS</font></a>
<a href="javascript: izmenisliku (1)" style="font-weight: bold; font-size:
14pt; width: 150px; color: #000099; background-color: #ffff99" >
>NEXT &nbsp;></a>
</body>
</html>

7
Window open, close, blur focus, assign, replace, status back i
sl…

<html>
<body>
<form id="form1" runat="server">
<div>

<script type="text/javascript">
function closeWin()
{
myWindow.close()
}
</script>

<script type="text/javascript">
function openWin()
{
myWindow=window.open('','','width=500,height=300')
myWindow.document.write("Ovo je test Prozor za funkcije Open i Close")
}
</script>

<input type=button value="Otvori prozor" onclick="openWin()" style="font-


weight: bold; font-size: 14pt;
width: 150px; color: #000099; background-color: #ffff99" />
<br />
<br />
<br />
<input type="button" value="Zatvori prozor" onclick="closeWin()"
style="font-weight: bold;
font-size: 14pt; width: 150px; color: #000099; background-color: #ffff99"
/>

</div>
</form>
</body>
</html>

2 Blokiraj posetioce sa određenog domena

<script language="JavaScript" type="text/javascript">


if (document.referrer.indexOf('http://any_site.com/') != -1) {
alert('Posetioci sa domena:\n ' + document.referrer + ' ne mogu da
pristupe ovoj stranici');
history.back(-1);
if (document.referrer == 'http://www.domain_name.com/example.html') {
alert(''Posetioci sa adrese:\n '+document.referrer+' ne mogu da pristupe
ovoj stranici!');
history.back(-1);
}
</script>

8
Tooltip

<html>
<head>
<title>Style Example</title>
<script type="text/javascript">
function showTip(oEvent) {
var oDiv = document.getElementById("toolTipComponent");
oDiv.style.visibility = "visible";
oDiv.style.left = oEvent.clientX + 5;
oDiv.style.top = oEvent.clientY + 5;
}

function hideTip(oEvent) {
var oDiv = document.getElementById("toolTipComponent");
oDiv.style.visibility = "hidden";
}
</script>
</head>
<body>
<P>Predjite misem preko linka.</p>
<a href="http://www.myelab.net"
onmouseover="showTip(event)"
onmouseout="hideTip(event)">www.myelab.net</a>

<div id="toolTipComponent" style="background-color: gray; position:


absolute; visibility: hidden; padding: 5px">
<span style="font-weight: bold">Probni ToolTip</span><br/>
Ovde se nalaze informacije o predmetu Internet tehnologije
</div>

</body>
</html>

9
Promena boje pozadine

<html>

<body>
<form name="test" method="post">

<input type="button"
OnClick="document.bgColor = '#FFFFFF';"
value="bela">

<input type="button"
OnClick="document.bgColor = '#00FFFF';"
value="Zelena">

<input type="button"
OnClick="document.bgColor = '#FF00FF';"
value="Roze">

<input type="button"
OnClick="document.bgColor = '#FFFF00';"
value="Zuta">

</form>
</body>
</html>

Favour icon

<html>
<head>
<LINK REL="SHORTCUT ICON"
HREF="slika.jpg">
</head>
<body>
</body>
</html>

Zabrani desni klik

<html>
<body>
<script type=text/javascript>
document.oncontextmenu = function() { return false;}
</script>
</body>
</html>

10
Dodavanje sajta u bookmarks

<html>
<head>
<script type=text/javascript>
function addfav()
{
if (document.all)
{
window.external.AddFavorite
("http://www.myelab.net","Myelab sajt")
}
}
</script>
<head>
<body>

<input type="button"; onclick="addfav()" value="klikni za dodavanje sajta u


bookmarks">
</body>
</html>

Zoom picture

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"


"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1" />
<title>Untitled Document</title>
<script language=JavaScript>
function pronadjisliku(objectId) {
if (document.getElementById) {
return (document.getElementById(objectId));}
if (document.all) {
return (document.all[objectId]);}
}
function zoom(type,imgx,sz) {
imgd = pronadjisliku(imgx);
if (type=="+" && imgd.width < 500) {
imgd.width += 30;imgd.height += sz;}
if (type=="-" && imgd.width > 20) {
imgd.width -= 30;imgd.height -= (sz);}
}
</script>
</head>
<body>
<div align="center"><img id="myimg" alt=""
src="slika1.jpg" width="66" height="92"><br />
<a href="#"
onclick="zoom('-','myimg',92/66)">Smaller</a> |
<a href="#"

11
onclick="zoom('+','myimg',92/66)">Bigger</a>
</div>
</body></html>

Mini kalkulator

<html>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function a_plus_b(form) {
a=eval(form.a.value)
b=eval(form.b.value)
c=a+b
form.ans.value = c
}
function a_minus_b(form) {
a=eval(form.a.value)
b=eval(form.b.value)
c=a-b
form.ans.value=c
}
function a_times_b(form) {
a=eval(form.a.value)
b=eval(form.b.value)
c=a*b
form.ans.value=c
}
function a_div_b(form) {
a=eval(form.a.value)
b=eval(form.b.value)
c=a/b
form.ans.value = c
}
function a_pow_b(form) {
a=eval(form.a.value)
b=eval(form.b.value)
c=Math.pow(a, b)
form.ans.value = c
}
</SCRIPT>
</head>
<BODY>
<CENTER>
<FORM name="formx"><input type=text size=4 value=12 name="a">
<input type="button" value=" + " onClick="a_plus_b(this.form)">
<input type="button" value=" - " onClick="a_minus_b(this.form)">
<input type="button" value=" x " onClick="a_times_b(this.form)">
<input type="button" value=" / " onClick="a_div_b(this.form)">
<input type="button" value=" ^ " onClick="a_pow_b(this.form)">
<input type="number" size=4 value=3 name="b"> = <input type "number"
value=0 name="ans" size=9>
</FORM>
</body>
</html>

12
Meni

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"


"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
div#KolonaMeni
{
width:150px;
height:150px;
background-color:#0099FF;
border: 3px solid #90C8FF;
}
div#KolonaMeni a
{
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color: #FFFFFF;
text-decoration:none;
display:block;
text-align:center;
border-top-width: 7px;
border-top-style:double;;
border-top-color: #9FC6FF;
}
div#KolonaMeni a:hover
{
color: #0099FF;
background-color: #B9E3FF;
}

div#podmeni1, #podmeni2, #podmeni3


{
display:none;
background-color:#80CEFD;
border:solid;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #0066FF;
border-bottom-color:#FFFFFF;
}
div#KolonaMeni #podmeni1 a, div#KolonaMeni #podmeni2 a, div#KolonaMeni
#podmeni3 a
{
padding-left:10px;
font-size:12px;
color:#000000;
border:none;
}
</style>
<script>
function prikazi(broj)
{

13
if (document.getElementById('podmeni' + broj).style.display == 'block')
{
document.getElementById('podmeni' + broj).style.display = 'none'
}
else
{
document.getElementById('podmeni' + broj).style.display = 'block'
}
}
</script>

</head>

<body bgcolor="#0066FF">
<div id="KolonaMeni">
<a href="#" onmouseover="prikazi(1)">Prva stavka</a>
<div id="podmeni1">
<a href="#">Podstavka 1</a>
<a href="#">Podstavka 2</a>
<a href="#">Podstavka 3</a>
</div>

<a href="#" onmouseover="prikazi(2)">Druga stavka</a>


<div id="podmeni2">
<a href="#">Podstavka 1</a>
<a href="#">Podstavka 2</a>
<a href="#">Podstavka 3</a>
</div>

<a href="#" onmouseover="prikazi(3)">Treca stavka</a>


<div id="podmeni3">
<a href="#">Podstavka 1</a>
<a href="#">Podstavka 2</a>
<a href="#">Podstavka 3</a>
</div>
</div>
</body>

</html>

14
Najjednostavniji meni

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"


"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1" />
<title>Untitled Document</title>
<script language="JavaScript">

function razvuci(list){
var listElementStyle=document.getElementById(list).style;
if (listElementStyle.display=="none")
{
listElementStyle.display="block";
}
else {
listElementStyle.display="none";
}
}
</script>

</head>
<body>

<a href="javascript:razvuci('Stavka1')">Stavka1</a>
<ul>
<li style="display: none;" id="Stavka1">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
</li>
</ul>
<a href="javascript:razvuci('Stavka2')">Stavka2</a>
<ul>
<li style="display: none;" id="Stavka2">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
</li>
</ul>

</body>
</html>

15
Meni 1

<html>
<HEAD>
<script type="text/javascript">
function startmenu()
{
menu0.style.display = "none";
menu1.style.display = "none";
menu2.style.display = "none";
}

function menu0func()
{
if(menu0.style.display == "none")
{

menu0.style.display = "block";
}
else
{
menu0.style.display = "none";
}
}
function menu1func()
{
if(menu1.style.display == "none")
{
menu1.style.display = "block";
}
else
{
menu1.style.display = "none";
}
}
function menu2func()
{
if(menu2.style.display == "none")
{
menu2.style.display = "block";
}
else
{
menu2.style.display = "none";
}
}

</script>

</HEAD>

<BODY onLoad="javascript:startmenu()">
<table align="center">
<tr><td>

<a href="javaScript:menu0func()"><img src="new.gif"></a>


<font size=5>Predmeti</font>
<div id="menu0">
<img src="arrow.gif"><a href=''>Elektronsko poslovanje</a><br>

16
<img src="arrow.gif"><a href=''>Simulacija</a><br>
<img src="arrow.gif"><a href=''>Internet tehnologije</a><br>
</div>
<br>
<a href="javaScript:menu1func()"><img src="new.gif"></a>
<font size=5>Godina</font>
<div id="menu1">
<img src="arrow.gif"><a href=''>Druga</a><br>
<img src="arrow.gif"><a href=''>Treca</a><br>
<img src="arrow.gif"><a href=''>Cetvrta</a><br>
</div>
<br>
<a href="javaScript:menu2func()"><img src="new.gif"></a>
<font size=5>Oblasti</font>
<div id="menu2">
<img src="arrow.gif"><a href=''>XML</a><br>
<img src="arrow.gif"><a href=''>HTML</a><br>
<img src="arrow.gif"><a href=''>JavaScript</a><br>
<img src="arrow.gif"><a href=''>AJAX</a><br>
<img src="arrow.gif"><a href=''>PHP</a><br>
</div>
<br>
</td></tr>
</table>
</body>
</html>

17
3 Meni sa tabovima

<html>
<script>
function getDesc(tip) {
if (document.getElementById) {
document.getElementById("tipArea").innerHTML = tip }
}

var menu_1 = 'Opis usluga.';


var menu_2 = 'Opis proizvoda.';
var menu_3 = 'Opis kompanije';
var menu_4 = 'Kontakt informacije';

</script>

<style type="text/css">
#theTabMenu {
padding:3px 0;
margin:0;
border-bottom:1px solid black;
font:bold 11px arial,helvetica,sans-serif; }

#theTabMenu li {
list-style:none;
margin:0;
display:inline; }

#theTabMenu li a {
padding:3px 8px;
margin-left:4px;
border:1px solid black;
background:aqua;
text-decoration:none; }

#theTabMenu li a:link { color:black; }


#theTabMenu li a:visited { color:black; }

#theTabMenu li a:hover {
color:black;
background:white;
border-color:black;
border-bottom:1px solid white; }

#theTabMenu li.active {
padding:3px 8px;
margin:4px;
background:white;
border:1px solid black;
border-bottom:1px solid white; }

.sublinks {
border-right:1px black solid;
border-left:1px black solid;
border-bottom:1px black solid;
padding:4px;

18
padding-left:10px;
font-family:verdana,arial,helvetica,sans-serif; font-size:11px; }
</style>

<body>
<div>
<ul id="theTabMenu">
<li class="active">Home</li>
<li><a href="#" title="Features"
onmouseover="getDesc(menu_1)">Usluge</a></li>
<li><a href="#" title="Products"
onmouseover="getDesc(menu_2)">Proizvodi</a></li>
<li><a href="#" title="About Us" onmouseover="getDesc(menu_3)">O
nama</a></li>
<li><a href="#" title="Contact"
onmouseover="getDesc(menu_4)">Kontakt</a></li>
</ul>
</div>
<div class="sublinks">
<ilayer id="tipArea1" class="description">
<layer id="tipArea1" class="description">
<div id="tipArea" class="description">
Ovde se pojavljuje tekst vezan za tabove
</div>
</layer>
</ilayer>
</div>
</body>
</html>

19
4 Forma – ceo primer

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"


"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1" />
<title>Validacija forme</title>
<style type="text/css">
.pro
{
border: 3px solid #90C8FF;
}
</style>
<script language="JavaScript">
function validacija()
{
if (document.forms[0].ime.value=='')
{
alert("Niste uneli Vase ime!");
document.forms[0].ime.focus();
return false
}
if (document.forms[0].prezime.value=='')
{
alert("Niste uneli Vase prezime!");
document.forms[0].prezime.focus();
return false;
}
if (document.forms[0].sifra.value=='')
{
alert("Niste uneli sifru !");
document.forms[0].sifra.focus();
return false;
}
if (document.forms[0].mail.value=='')
{
alert("Niste uneli e-mail adresu!");
document.forms[0].mail.focus();
return false;
}
if(document.forms[0].mail.value.indexOf('@') == -1)
{
alert("Niste uneli e-mail adresu u odgovarajucem formatu!");
document.forms[0].mail.focus();
return false;
}
var pom=proveriradio(document.forms[0].pol)
if (pom == null)
{
alert('Niste selektovali pol');
return false;
}
confirm("Ispravno ste uneli sve podatke, da li nastavljate sa
registracijom");
var a=window.location.replace("fajl za obradu registracije na serveru");

20
return true;

}
function proveriradio(btn)
{
var cnt = -1;
for (var i=btn.length-1; i > -1; i--) {
if (btn[i].checked) {cnt = i; i = -1;}
}
if (cnt > -1) return btn[cnt].value;
else return null;
}

</script>
<SCRIPT LANGUAGE="JavaScript">
var pomocna = "false";
function proveri(polje) {
if (pomocna == "false") {
for (i = 0; i < polje.length; i++) {
polje[i].checked = true;}
pomocna = "true";
return "Obrisi sve cekirane"; }
else {
for (i = 0; i < polje.length; i++) {
polje[i].checked = false; }
pomocna = "false";
return "Oznaci sve"; }
}
// End -->
</script>
</HEAD>

</head>
<body>
<form class="pro" onsubmit="return validacija()">
<p><b><font size=4>Ovo forma sluzi kao primer koriscenja JavaScript-a za
validaciju</font></b></p>
<b>Izaberite pol:</b>
<input type="radio" name="pol" value="male"> Zenski
<input type="radio" name="pol" value="female"> Muski
<br>
<br>
<b>Unesite ime i prezime:</b>
<br>
<br>
<b>Ime</b>
<input type="text" name="ime">
<br>
<b>Prezime</b>
<input type="text" name="prezime">
<br>
<b>Sifra</b>
<input type="password" name="sifra">
<br>
<br>
<b>Selektujte kurseve koje pohadjate:</b>
<br>
<br>
Simulacija i simulacioni jezici
<input type="checkbox" name="predmet" value="" />

21
<br>
Internet tehnologije
<input type="checkbox" name="predmet" value="" />
<br>
Upravljanje rizikom u informacionim sistemima
<input type="checkbox" name="predmet" value="" />
<br>
Konkurentno programiranje
<input type="checkbox" name="predmet" value="" />
<br>
Elektronsko poslovanje
<input type="checkbox" name="predmet" value="" />
<br>
<br>
<input type=button value="Oznaci sve"
onClick="this.value=proveri(this.form.predmet)">
<br>
<br>
<b>Unesite e-mail adresu:</b>
<br>
<input type="text" name="mail" size="35">
<br>
<br>
<b>Sta ocekujete od kurseva?</b>
<br>
<textarea name="area" rows="10" cols="30">

</textarea>
<br>
<br>
<b>Upload slike:</b>
<br>
<INPUT type="file" name="file">
<br>
<br>
<INPUT type="submit" value="Registruj se" name="submit">
<INPUT type="reset" value="Obrisi podatke" namer="reset">

</form>

</body>
</html>

22
Cookie – brojač poseta

<html>
<head>
<script language=JavaScript>
var novikuki = document.cookie;
var delovikukija = novikuki.split("=");
var imekukija = delovikukija[0];
var vrednostkukija = unescape(delovikukija[1]);
var prethodnavrednost = vrednostkukija;
if (imekukija != "brojac" || vrednostkukija == null) {
prethodnavrednost = 0;
}
var novavrednost = parseInt(prethodnavrednost) + 1;
var newDate = new Date();
newDate.setTime(newDate.getTime() + 2592000000);
document.cookie = " brojac=" + novavrednost + ";expires=" +
newDate.toGMTString();

</script>
</head>
<body>
<script language="JavaScript">
document.write("Ovu stranicu ste posetili "+ novavrednost + " puta.");
</script>
</body>
</html>

Cookie – primer 2

<html><head><title>Pravljenje kukija</title>
<script language="JavaScript">
function napraviKuki(forma){
var kada = new Date();
kada.setMinutes(kada.getMinutes() + 1); // kuki istice za 1 minut
imeGosta=forma.ime_gosta.value;
document.cookie="ime="+escape(imeGosta)+";expires="+kada.toGMTString();
alert(unescape(document.cookie));
}

function dobrodosli(forma){
var pozicija=document.cookie.indexOf("ime=");
if ( pozicija != -1){
// ako je nasao podstring (-1 je vrednost ako nije nasao podstring)
var pocetak = pozicija + 4;
var kraj=document.cookie.indexOf(";",pocetak);
//ako je ubacen neki od atributa kukija, odvojen je sa ; pa ce kraj
naci //poziciju od ;
if(kraj == -1){ kraj=document.cookie.length;}
// -1 znaci da nije nadjen ; onda pretpostavlja da je duzina do kraja
//kukija
gost= unescape(document.cookie.substring(pocetak,kraj));
alert("Dobrodosli " + gost);

23
} else { alert("Danas nema kukija (kolacica :) )");}
}

</script>
</head>
<body onLoad="document.mojaForma.reset()" >
<center>
<form name="mojaForma">
Kako se zovete?
<br>
<input type="text" name="ime_gosta" >
<p>
<input type="button" value="Make cookie"
onClick="napraviKuki(this.form);">
<p>
<input type="button"
value="Get Cookie" onClick="dobrodosli(this.form);">
<p>
</form>
</body>
</html>

5 Cookie Remember me

<html>
<head>

function newCookie(name,value)
{

document.cookie = name+"="+value;

function readCookie(name) {
var nameSG = name + "=";
var nuller = '';
if (document.cookie.indexOf(nameSG) == -1)
return nuller;

var ca = document.cookie.split(';');
for(var i=0; i<ca.length; i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameSG) == 0) return c.substring(nameSG.length,c.length); }
return null; }

function eraseCookie(name) {
newCookie(name,""); }

function toMem(a) {
newCookie('theName', document.form.name.value);
newCookie('theEmail', document.form.email.value); }

function delMem(a) {
eraseCookie('theName');
eraseCookie('theEmail');

24
document.form.name.value = '';
document.form.email.value = ''; }
</script>
</head>
<body>

<form name="form" action="http://www.myelab.net" method="post" onSubmit="if


(this.checker.checked) toMem(this)">
<input type="text" id="name" name="name" />
<input type="text" id="email" name="email" />
<input type="button" onclick="delMem(this)" value="Delete Information" />
<input type="checkbox" id="checker" name="checker" />
<input type="submit" id="submit" name="submit" />

</form>

<script type="text/javascript" language="javascript">


<!--
document.form.name.value = readCookie("theName");
document.form.email.value = readCookie("theEmail");
//-->
</script>
</body>
</html>

25

You might also like