• 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

VPS Starter Arubacloud
0 głosów
351 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ź 200 wizyt
pytanie zadane 27 października 2015 w PHP przez Michau Xlow Pasjonat (15,190 p.)
0 głosów
2 odpowiedzi 497 wizyt
pytanie zadane 7 listopada 2015 w HTML i CSS przez 0xf Dyskutant (8,180 p.)
0 głosów
1 odpowiedź 343 wizyt

92,454 zapytań

141,262 odpowiedzi

319,099 komentarzy

61,854 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

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 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!

...