• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Skrypt ocenianie/głosowanie na www

Object Storage Arubacloud
0 głosów
359 wizyt
pytanie zadane 31 października 2015 w JavaScript przez Michau Xlow Pasjonat (15,190 p.)
edycja 6 listopada 2015 przez Michau Xlow

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>


 

2 odpowiedzi

+1 głos
odpowiedź 31 października 2015 przez furas Maniak (53,800 p.)
Wybór można zapamiętywac w ciasteczku. Choć jak ktoś skasuje ciasteczko to znowu będzie mógł zagłosować. Nie ma chyba idealnego sposobu jeśli użytkownik może głosować bez zalogowania się.
komentarz 31 października 2015 przez Michau Xlow Pasjonat (15,190 p.)
Okej, dzięki za podpowiedź, a jak tego dokładniej dokonać, żeby wpis wprowadzić do ciasteczek? Dodałem kod dla lepszego wglądu.
komentarz 31 października 2015 przez furas Maniak (53,800 p.)

W JavaScript jest zmienna `document.cookie` która zawiera jako jeden długi tekst informacje o wszystkich ciasteczkach przypisanych do danego adresu. Standardowo trzeba samemu bawić się w dzielenie na pojedyńcze ciasteczka i podmienianie na nowe czy sprawdzanie czy już jest ustawione.

komentarz 6 listopada 2015 przez Michau Xlow Pasjonat (15,190 p.)
Rzeczywiście jest takowa zmienna, wyszukałem w internecie informacje na jej temat, mimo w miarę ładnie opisanej funkcji document.cookie mam problem z dodaniem jej do powyższego kodu oceny... Nie ukrywam, że kombinowałem już na różne sposoby, mimo tego wciąż nie moge temu sprostać... Jak można tego dokonać?
+1 głos
odpowiedź 6 listopada 2015 przez writen Nałogowiec (29,060 p.)
Zapisanie w ciastku nic nie zmieni, bo głos zostanie zapamiętany wyłącznie w przeglądarce użytkownika, który ten głos oddał. Bez sensu.

Każdy oddany głos powinieneś zapisywać na serwerze, najlepiej w bazie danych. Całość powinna zawierać głos (ile gwaizdek), do czego ten głos (identyfikator artykułu), kto oddał głos (np. numer IP, id usera, itd.), ewentualnie datę i co tam jeszcze chcesz. Natomiast przy wyświetlaniu głosów należy porównać czy dany uzytkownik już głosował (porównać IP, sprawdzić id użytkownika) i jeśli tak zablokować możliwość ponownego głosowania. To wszystko musi być robione po stronie serwera, np. w PHP. W JS możesz to zrobić wysyłąjąc żądanie przez AJAX do skryptu PHP, który da jedynie odpowiedź czy oddanie głosu powiodło się.
komentarz 6 listopada 2015 przez Michau Xlow Pasjonat (15,190 p.)
Wiem, że najszybszym rozwiązaniem jest rozwiązanie w PHP i całkiem sporo przykładów jest przedstawionych w sieci, niemniej jednak dziękuję uprzejmię za wyjaśnienia co do bibilioteki document.cookie. Czyli poza rozwiązaniem w PHP nie ma opcji innego zapisu aktualnie oddanych głosów, nie wiem, dajmy na to do pliku txt? :D
komentarz 6 listopada 2015 przez writen Nałogowiec (29,060 p.)
No niestety nie możesz tego zrobić w JS'ie, bo on działa po stronie przeglądarki (wyjątkiem jest nodeJS). Możesz to zrobić w jakimkolwiek języku server-side. Najpopularniejszym jest PHP.
komentarz 6 listopada 2015 przez Michau Xlow Pasjonat (15,190 p.)
Tak to akurat wiem, myślałem, że może istnieć jakaś opcja zapisu do pliku na serwerze, bez konieczności tworzenia bazdy danych tak jak np: ma to miejsce przy skrypcie dodawania komentarzy, zapisują się w pliku .txt na serwerze.
komentarz 6 listopada 2015 przez writen Nałogowiec (29,060 p.)
A to tak. W PHP na serwerze możesz robić co zechcesz, do pliku zapisywać też możesz.
komentarz 7 listopada 2015 przez Michau Xlow Pasjonat (15,190 p.)
Dzięki śliczne za pomoc, ogarnąłem temat. :-)

Podobne pytania

0 głosów
1 odpowiedź 201 wizyt
pytanie zadane 27 października 2015 w PHP przez Michau Xlow Pasjonat (15,190 p.)
0 głosów
2 odpowiedzi 505 wizyt
pytanie zadane 7 listopada 2015 w HTML i CSS przez 0xf Dyskutant (8,180 p.)
0 głosów
1 odpowiedź 344 wizyt

92,539 zapytań

141,382 odpowiedzi

319,476 komentarzy

61,928 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Kolejna edycja największej imprezy hakerskiej w Polsce, czyli Mega Sekurak Hacking Party odbędzie się już 20 maja 2024r. Z tej okazji mamy dla Was kod: pasjamshp - jeżeli wpiszecie go w koszyku, to wówczas otrzymacie 40% zniżki na bilet w wersji standard!

Więcej informacji na temat imprezy znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...