Witam, mam kod, którego zadaniem ma być ocenianie artykułów strony, w chwili obecnej wygląda w ten sposób
jednak po wybraniu oceny i odświeżeniu strony wybór nie zostaje zapamiętany.
Moje pytanie to, w jaki najprostszy sposób po odświeżeniu strony wybór zostaje zapamiętany...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Stars Rating</title>
<meta charset="utf-8"/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<center>
<table>
<td>
<script type="text/javascript">
<!--
var set=false;
var v=0;
var a;
function loadStars()
{
star1 = new Image();
star1.src = "star1.gif";
star2 = new Image();
star2.src= "star2.gif";
}
function highlight(x)
{
if (set==false)
{
y=x*1+1
switch(x)
{
case "1": document.getElementById(x).src= star2.src;
document.getElementById('vote').innerHTML="badziewie:(";
break;
case "2":for (i=1;i<y;i++)
{
document.getElementById(i).src= star2.src;
}
document.getElementById('vote').innerHTML="jako tako"
break;
case "3":for (i=1;i<y;i++)
{
document.getElementById(i).src= star2.src;
}
document.getElementById('vote').innerHTML="średnio na jeża"
break;
case "4":for (i=1;i<y;i++)
{
document.getElementById(i).src= star2.src;
}
document.getElementById('vote').innerHTML="całkiem, całkiem"
break;
case "5":for (i=1;i<y;i++)
{
document.getElementById(i).src= star2.src;
}
document.getElementById('vote').innerHTML="elegancko:)"
break;
}
}
}
function losehighlight(x)
{
if (set==false)
{
for (i=1;i<6;i++)
{
document.getElementById(i).src=star1.src;
document.getElementById('vote').innerHTML=""
}
}
}
function setStar(x)
{
y=x*1+1
if (set==false)
{
switch(x)
{
case "1": a="1"
flash(a);
break;
case "2": a="2"
flash(a);
break;
case "3": a="3"
flash(a);
break;
case "4":a="4"
flash(a);
break;
case "5":a="5"
flash(a);
break;
}
set=true;
document.getElementById('vote').innerHTML="dziękujemy za oddany głos!"
}
}
function flash()
{
y=a*1+1
switch(v)
{
case 0:
for (i=1;i<y;i++)
{
document.getElementById(i).src= star1.src;
}
v=1
setTimeout(flash,200)
break;
case 1:
for (i=1;i<y;i++)
{
document.getElementById(i).src= star2.src;
}
v=2
setTimeout(flash,200)
break;
case 2:
for (i=1;i<y;i++)
{
document.getElementById(i).src= star1.src;
}
v=3
setTimeout(flash,200)
break;
case 3:
for (i=1;i<y;i++)
{
document.getElementById(i).src= star2.src;
}
v=4
setTimeout(flash,200)
break;
case 4:
for (i=1;i<y;i++)
{
document.getElementById(i).src= star1.src;
}
v=5
setTimeout(flash,200)
break;
case 5:
for (i=1;i<y;i++)
{
document.getElementById(i).src= star2.src;
}
v=6
setTimeout(flash,200)
break;
}
}
-->
</script>
</td>
</table>
</center>
</head>
<body onload="loadStars()">
<img src="star1.gif" onmouseover="highlight(this.id)" onclick="setStar(this.id)" onmouseout="losehighlight(this.id)" id="1" style="width:30px; height:30px; float:left;" />
<img src="star1.gif" onmouseover="highlight(this.id)" onclick="setStar(this.id)" onmouseout="losehighlight(this.id)" id="2" style="width:30px; height:30px; float:left;" />
<img src="star1.gif" onmouseover="highlight(this.id)" onclick="setStar(this.id)" onmouseout="losehighlight(this.id)" id="3" style="width:30px; height:30px; float:left;" />
<img src="star1.gif" onmouseover="highlight(this.id)" onclick="setStar(this.id)" onmouseout="losehighlight(this.id)" id="4" style="width:30px; height:30px; float:left;" />
<img src="star1.gif" onmouseover="highlight(this.id)" onclick="setStar(this.id)" onmouseout="losehighlight(this.id)" id="5" style="width:30px; height:30px; float:left;" /><br /><br />
<div id="vote" style="font-family:tahoma; color:red;"></div>
</body>
</html>