Bild per Mausklick ändern

[Martin23]

Hallo,

ich habe mir ein JavaScript geschrieben welches per Klick das Aktuelle Bild wechselt und die Nummer des neuen Bild in einem Cookie vermerkt.

Ich möchte ein Bild was per Mausklick  verändert werden kann aber beim nächsten Aufruf der Seite soll das zuletzt gewählte Bild erscheinen.

Mein Problem ist wenn ich ein Startbild per src="" aufrufe, kann ich zwar die Bilder ändern aber beim Neustart der Seite kommt natürlich wieder das Startbild.
Hat jemand eine Idee wie man das lösen kann?

  
<script type="text/javascript">  
var a=1;  
var b=0;  
    pic = new Array();  
   pic[1] = new Image(); pic[1].src = "Bild.jpg";  
    pic[2] = new Image(); pic[2].src = "Bild.jpg";  
    pic[3] = new Image(); pic[3].src =  "Bild.jpg";  
  
  document.cookie =a;  
  
function weiter()  
{  
       if(document.cookie)  
      {  
          a = document.cookie;  
          a.split(";");  
          var b = a[0];  
          document.getElementById('meinBild').src = pic[b].src;  
          a = a[0];  
      }  
      else  
      {  
          document.getElementById('meinBild').src = pic[1].src;  
      }  
    ++a;  
    if(a>3){a=1}  
    document.cookie =a;  
}  
  </script><p align="center" style="text-align: left"><img width="15%" id="meinBild" onclick="weiter()" alt=""/></p>  

[Felix Riesterer]

Lieber Martin23,

Du hast offensichtlich ein Timing-Problem. Was soll zuerst geschehen?

Ich würde schon das "Startbild" im Dokument notieren, welches aber schon beim Aufbau des Dokuments je nach Cookie-Daten geändert wird. Am wenigesten kompliziert wird es wohl sein, wenn Du direkt nach dem <img>-Element ein <script>-Element notierst, welches die Umschaltung sofort vornimmt. Mit document.images[document.images.length -1].src solltest Du auf die URL des "letzten notierten Bildes" (also das, welches unmittelbar vor Deinem <script>-Element steht) zugreifen können.

document.cookie =a;

Damit wirst Du nicht unbedingt glücklich. Schau mal, wie das bei SELFHTML vorgeschlagen wird: http://de.selfhtml.org/javascript/objekte/document.htm#cookie@title=document.cookie

Liebe Grüße,

Felix Riesterer.

[Martin23]

Hallo Felix,

ich muss dazu sagen das meine Javascript und Html Kenntnisse sich noch sehr in Grenzen halten. Startbild war vllt auch der falsche Ausdruck , Das Bild stellt eine Ampel dar die am Anfang auf grün gesetzt ist und per klick eine Farbe nach oben wechselt. Die Farbe die als letztes gewählt wurde soll dann beim nächsten Aufruf der Seite auch angezeigt werden.

Ich kann irgendwie deinen Gedankengang nicht folgen, könntest du mir ein Beispiel zeigen ?

Mit freundlichen Grüßen

Martin

[Martin23]

Hallo Felix,

danke dir vielmals, nach dem ich nochmal deine Anweisung genau gelesen habe, habe ich eine Lösung gefunden.

[Martin23]

So nun habe ich doch ein Problem gefunden.

Gibt es eine Möglichkeit die Browser anzupassen ? Weil Firefox und IE für sich funktionieren. Nur wenn man im einem das Bild ändert ignoriert der andere es.

[Felix Riesterer]

Lieber Martin23,

Nur wenn man im einem [Browser] das Bild ändert ignoriert der andere es.

klar, die Browser verwalten jeweils ihre eigenen Cookies. Warum auch sollte ein Cookie zentral abgelegt werden? Führte ein "Cookie-Sharing" bei Dir nicht auch zu zentralen Sicherheitsbedenken? Immerhin werden in Cookies auch Sachen gespeichert, die bei Anmeldungen auf Webseiten von Bedeutung sind!

Wenn Du eine "Einstellung" für einen Besucher speichern willst (in Deinem Fall den Zustand der Ampel), dann musst Du sicherstellen, dass Deine Website den Besucher wieder erkennt. Das geschieht durch Login-Systeme, welche dann eine Session starten. Hast Du Dich dann in allen Deinen Browsern angemeldet, und kann der Server Deinem Login deine jeweils letzte Ampel-Einstellung zuordnen, dann sollte in allen Browsern Deine jeweilige Ampelstellung sichtbar werden. Aber ohne serverseitige Logik (z.B. Perl oder PHP) kommst Du hier nicht weiter. JavaScript (im Browser) ist dafür keine Lösung.

Liebe Grüße,

Felix Riesterer.