www.webdeveloper.com
Results 1 to 2 of 2

Thread: Issue with Javascript cookies

  1. #1
    Join Date
    Mar 2012
    Posts
    1

    Issue with Javascript cookies

    Hello! I'm having an odd issue with getting cookies to work on my page with Javascript.

    The idea is that I want the key1.gif to display after the user has visited the page once. In other words, a new user should be able to come to the page, refresh and now the key1.gif is there.

    I'm trying to display it either by just directly putting up the image, or, preferably, altering the CSS of the #key2 so it displays. I'm doing both right now, just so I can at least get something to work, haha.

    Here's a snippet of the html:
    HTML Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    @import url("TowerCSS.css");
    
    .background {
    	background-color: #006;
    }
    </style>
    
    </head>
    
    <body>
    <script language="javascript" type="text/javascript" src="cookie1.js">  
    var x = readCookie('key_1')
    if (x) {
    	<img src="key.gif" width="176" height="80" z-index="2" />
    	$('#key2').show();
    } 
    
    if (!x) {
    	 createCookie('key_1','testcookie',7)
    }
    </script>
    Here's the CSS being used for #key2:
    Code:
    #key2 {
    	display: none;
    	top: 400px;
    	left: 50%;
    	margin-left: -300px;
    	position: absolute;
    	z-index: 2;
    	visibility: show;
    }
    Aaand the javascript file cookie1.js:
    Code:
    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);
    }
    All images can display correctly and work. It's just getting it to work via cookies that nothing decides to show...

    I'm relatively new to javascript, so any assistance at all would be appreciated

  2. #2
    Join Date
    Feb 2003
    Location
    Michigan, USA
    Posts
    5,773
    You cannot intermingle JavaScript and HTML. Move the <img> tag outside and before the <script> tag:

    Code:
    <body>
    <img src="key.gif" width="176" height="80" z-index="2" id="key2" />
    <script language="javascript" type="text/javascript" src="cookie1.js">  
    var x = readCookie('key_1')
    if (x) {
    The <img> tag also needs an Id.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles