Just nu i M3-nätverket
Jump to content

Cookie


rumbleinthejungles

Recommended Posts

rumbleinthejungles

Jag har skapat en dropdownmeny från vilken användaren kan välja en stilmall. Information om bytet sparas i en cookie. Trots att cookien sparas återgår webbsidan till default när man trycker Uppdatera. Vad beror det på?

<script type="text/javascript">
function setCookie(min_cookie)
{
document.getElementById('dd').onchange=function(){
var valt_varde =this.value;
document.cookie = escape(valt_varde);
readCookie();
}
}

function readCookie()
{
var cookie_innehall =document.cookie;
document.getElementById("cssmall").href= cookie_innehall+ ".css";
}
</script>

<link rel="stylesheet" href="css0.css" type="text/css" id="cssmall"  />
<link rel="alternate stylesheet" href="css1.css" title="1css" type="text/css" id="cssmall1"  />


<select onchange="setCookie(this.options[this.selectedIndex].value);" id="dd">
<option value="css0">Default</option>
<option value="css1">Alt 1</option>
</select>

 

[inlägget ändrat 2009-05-18 13:18:01 av rumbleinthejungles]

 

KOD-taggar tillagda av moderator

 

[inlägget ändrat 2009-05-18 23:40:38 av Cluster]

Link to comment
Share on other sites

Jag hade kanske inte läst kakan i setCookie utan anropat funktion att ändra stylesheeten istället.

 

quirksmode.org listar följande funktioner för kakor:

function createCookie(name,value,days) {
if (days) {
	var date = new Date();
	date.setTime(date.getTime()+(days*24*60*60*1000));
	var expires = "; expires="+date.toGMTString();
}
else var expires = "";
document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name) {
var nameEQ = name + "=";
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(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}

function eraseCookie(name) {
createCookie(name,"",-1);
}

vilket är en bra början.

 

Då kan man göra om dina funktioner till följande: (som man lägger inuti window.onload; se kod längst ner i inlägget).

document.getElementById("dd").onchange=function()
{
 var x = document.getElementById("dd").selectedIndex;
 var x_value=document.getElementById("dd").options[x].value;
 if (!x_value =="" ){ // om värdet inte är tomt så sätt kaka och ändra stilmall
   createCookie("stilmall", escape(x_value),365);
   setStyle(escape(x_value));
 }
}

function setStyle(csshref)
{
 document.getElementById("cssmall").href= csshref + ".css";
}

 

När du sedan skall ändra stilmallen på varje sida använder du följande script:

window.onload = function()
{
  var x = readCookie("stilmall"); //värdet i kakan
  if (x) {
    setStyle(x); //om kakan finns ändra stilmallen		
	//om du vill att selectlisten automatiskt skall ändras till det värde som kakan har kan du loopa och kontrollera selectlisten mot kakan
	for(i=0;i<document.getElementById("dd").length;i++){
		if(document.getElementById("dd").options[i].value==x) {
		document.getElementById("dd").options[i].selected=true; 
		}
	}
	//avsnittet slutar här
  }
  document.getElementById("dd").onchange=function()
	{
	  var x = document.getElementById("dd").selectedIndex;
	  var x_value=document.getElementById("dd").options[x].value;
	  if (!x_value =="" ){ 
	  // om värdet inte är tomt så sätt kaka och ändra stilmall
		createCookie("stilmall", escape(x_value),365);
		setStyle(escape(x_value));
	  }
	}
}

 

Och när du kollar det jag skrivit så känns det väl rätt logiskt, och man kan använda samma funktioner till flera saker, eller hur?!

 

-------------------------------------

Jonas

Moderator - CD/DVD-bränning, Kameror, Print - om trycksaker samt Bildredigering

 

[inlägget ändrat 2009-05-18 19:31:22 av Jonas_Bo]

[inlägget ändrat 2009-05-18 19:49:45 av Jonas_Bo]

Link to comment
Share on other sites

förresten, ändra

<select onchange="setCookie(this.options[this.selectedIndex].value);
" id="dd">

till

<select id="dd">

 

Link to comment
Share on other sites

rumbleinthejungles

Tack! Jag har ännu inte haft möjlighet att studera ditt förslag, men nu skall jag ta itu med det. Tack ännu en gång.

 

Link to comment
Share on other sites

rumbleinthejungles

Tack för ditt svar. Jag har studerat det och försökt skapa något själv. Det jag knåpade fram fungerar alldeles utmärkt när scriptet ligger inline i htmlfilen. När jag lägger det i en extern fil, slår stilmallsvalet inte igenom förrän man trycker Uppdatera i webbläsaren. Jag tycker ändå att det verkar logiskt. Vad kan det bero på, tror du?

 

http://www.bahnhof.se/wb846624/test/las_cookie.htm

 

 

 

Link to comment
Share on other sites

var är din onchange-funktion?

//---------------Skapa Cookie och välj CSS-mall----------------------------
  document.getElementById("dd").onchange=function()
	{
	  var x = document.getElementById("dd").selectedIndex;
	  var x_value=document.getElementById("dd").options[x].value;
	  if (!x_value =="" ){ 
	  // om värdet inte är tomt så sätt kaka och ändra stilmall
		createCookie("stilmall", escape(x_value),365);
		setStyle(escape(x_value));
	  }
	}

 

 

Sedan tror jag inte du behöver dessa

<link rel="alternate stylesheet" href="css1.css" title="1css" type="text/css" id="cssmall1"  /> 
<link rel="alternate stylesheet" href="css2.css" title="2css" type="text/css" id="cssmall2"  /> 

då den ändrar hrefen på den första cssen

 

och varför har du ändrat på de funktionerna du fått lagda fram? Då är det klart det inte fungerar.

 

Det är lite svårt att hjälpa när du ändrar förutsättningarna.

 

[inlägget ändrat 2009-05-22 13:08:09 av Jonas_Bo]

Link to comment
Share on other sites

rumbleinthejungles

Nej, den hade jag ju förträngt.... Nu fungerar det ju. Tack ännu en gång! Dina tips och förslag är, som alltid, ovärderliga. Du får skaffa dig ett Paypalkonto så man kan ge dig en donation för uthållighet med oss kognitivt mindre bemedlade entusiaster.

 

 

Din kod fungerade givetvis perfekt. Jag ändrade exemplet endast för att se om jag kan lära mig något på egen hand, inte för att krångla till det för dig.

[inlägget ändrat 2009-05-22 13:10:23 av rumbleinthejungles]

Link to comment
Share on other sites

Jag har redan paypalkonto men jag gör detta för karman, och lite poäng här på eforum ;)

*hint*

 

Link to comment
Share on other sites

rumbleinthejungles

Då skall jag vara bussig och ge dig möjlighet att bättra på karman ytterligare. :-)

 

Det är en sak som ditt script inte gör, mitt modifierade script gör det förvisso inte heller: att växla css-mall är en picknick och att sätta en cookie likaså, men om det inte finns någon gammal cookie, dvs. om webbläsaren aldrig har besökt sidan innan, väljer den ingen css-mall överhuvudtaget, vilket leder till att sidlayouten kollapsar.

Efter att ha kollat en extra gång ser jag att ditt script naturligtvis fungerar även i det avseendet. Vad tusan är det för fel på mitt?

[inlägget ändrat 2009-05-22 18:34:12 av rumbleinthejungles]

Link to comment
Share on other sites

det beror väl på hur du gjort med csserna och hur du valt att dela upp stilarna. Sådant kan jag inte gissa mig till hur du tänkt att det skall fungera.

 

Jag hade iaf gjort så här.

 

infoga en css-fil, låt oss kalla den "master". Denna innehåller layouten och annat viktigt.

 

Sedan har du 2 eller flera cssfiler som kan väljas till, vad de gör är egentligen oviktigt här, men det kan ha att göra med att ändra bakgrunds och textfärger för ökad kontrast och/ eller ändra storleken på typsnitten.

 

En css-fil måste läggas till efter "mastern" så låt det en mall som skall vara standard om besökaren inte besökt sidan innan. Finns det en cookie så används istället den. I link-taggen skall ett id finnas så att man kan knyta ändrigarna till denna. Link-taggen till master-css behöver inget id.

 

 

Link to comment
Share on other sites

rumbleinthejungles

Jag tycker att jag har gjort detta. Testade med följande:

   var cookies = document.cookie;
  if (cookies=="") {

document.getElementById("cssmall").href= "default.css";  
  }
  else{


      function readCookie(name) {
         var start = cookies.indexOf(name + "=");
         if (start == -1){
             createCookie();
         }
         start = cookies.indexOf("=", start) + 1;
         var end = cookies.indexOf(";", start);
         if (end == -1){
             end = cookies.length;
         }
         var value = unescape(cookies.substring(start, end));
         if(value == null){

           createCookie();
         } else{
           document.getElementById("cssmall").href= value + ".css";
         }
      }
      readCookie("stilmall");
}  

Detta fungerar under förutsättning att det inte redan finns cookies, vilket det ju bara alltför ofta gör. Ett exempel: om jag besökt idg.se får jag en cookie. När scriptet sedan skall avgöra om eforum.idg.se skall ha en cookie, upptäcker det den förra cookien och avstår. Följden blir att ingen cookie läses in.

 

[inlägget ändrat 2009-05-22 23:13:53 av rumbleinthejungles]

 

KOD-taggar tillagda av moderator

 

[inlägget ändrat 2009-05-22 23:59:07 av Cluster]

Link to comment
Share on other sites

du läser in helt fel, funktionen readCookie skall alltid läsas in (lägg den alltså inte inuti en if-sats), men funktionen behöver inte köras, men

 

default.css finns väl redan inläst, så varför göra det igen?

ligger inte den i en link-tagg?

 

var value = unescape(cookies.substring(start, end));

if(value == null){

 

createCookie();

Om inget värde finns; gör en kaka, men vilket värde skall kakan ha, och till VILKEN kaka skall du tilldela ett värde till?

 

Mitt råd: Kör inte på script som inte fungerar. Mitt fungerade alldeles utmärkt. Det script du hade kan du inte blanda med det du fick av mig, och jag förstår inte heller varför du vill blanda.

 

Link to comment
Share on other sites

jag har gjort ett fungerande exempel med de script jag tillhandahållit och ändrat i scriptfilen (som jag lagt externt, som du ville göra) för ökad tydlighet.

 

http://jonasboman.se/cookies/

 

Det fungerar med FF3, Chrome och IE6, som jag testat i.

 

 

Link to comment
Share on other sites

rumbleinthejungles

Tack! Jag har varit lite offline några dagar. Din sida verkar dock vara offline, den med. Den länk som du klistrat in genererar ett sidhämtningsfel.

 

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.



×
×
  • Create New...