cookies mit javascript auf HTML Seite

mrmoku · 24 Januar 2013

hallo, ich bin neu hier und hoffe mir kann jemand helfen! schon jetzt einmal vielen Dank!

ich will eine HTML Seite haben (q.html) auf der ein cookie über einen link gespeichert werden kann.
auf der zweiten seite (q2.html) soll 4.jpg gezeigt werden, wenn nichts gespeichert ist und 2.jpg, wenn der cookie vorher gespeichert wurde.
jetzt komme ich nicht mehr weiter:

hier q.html:

HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>TITEL</title>
<script type="text/javascript">
<!--

function WriteCookie()
{
  
document.cookie = 'gespeichert=ja;'; 

</script>
</head>
<body>

<h1>ÜBERSCHRIFT</h1>

<p><img src="1.jpg" width=400"" height="383" alt=""></p>
 <a href="q2.html">weiter</a><br>

<a href="#" onclick="WriteCookie()">Cookie speichern</a>

</body>
</html>

q2.html:

HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>TITEL</title>
<script type="text/javascript">

function preloader() 
 {
 
var x = GetCookie('gespeichert')
if (x == "") {
nichtgespeichert = new Image(100, 100);
nichtgespeichert.src = "4.jpg";
} else {
gespeichertt = new Image(100, 100);
gespeichertt.src = "2.jpg";
}

}

</script>

</head>
<body onLoad="javascript:preloader()">

<h1>ÜBERSCHRIFT2</h1>

</body>
</html>

Tronjer · 26 Januar 2013

Nimm niemals vanilla JS, wenn es auch jQuery sein kann.

Seite 1:

HTML:

<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="jquery.cookie.js"></script>
</head>
<body>
<a id="mylink" href="#">Klick Mich</a>
<script type="text/javascript">
$('#mylink').click(function(e) {
    e.preventDefault();
    $.cookie("foo", "bar");

     // Hier muss natürlich deine Seite verlinkt werden
    window.location.href = "page2.php";
});
</script>
</body>
</html>

Seite 2:

HTML:

<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="jquery.cookie.js"></script>
</head>
<body>
<img src="" alt="" />
<script type="text/javascript">
if ($.cookie("foo") !== null) {
    $('img').attr('src', 'image_1.png');
} else {
    $('img').attr('src', 'image_2.png');
}
$.cookie("foo", null);
</script>
</body>
</html>

Richtige Reihenfolge:

- Code kopieren.
- Die beiden Bibliotheken im <head> nicht vergessen.
- Tutorials zu jQuery und jQuery Cookie googeln.
- Fragen stellen, falls es dann immer noch nicht einleuchtend sein sollte.

cookies mit javascript auf HTML Seite

mrmoku

Neues Mitglied

Tronjer

Senior HTML'ler

Neueste Beiträge