I have a simple html page and a js script:
HTML page:
<body>
<input type="text" id = "content">
<button type="button" id="btn"> Save </button>
</body>
Javascript:
$(document).ready( function(){
var cook = $.cookie('theName', { path: '/'});
if ( cook )
alert(cook);
$('#btn').click(function(){
var theName = $('#content').val();
alert(v.val());
$.cookie('theName', theName, { path: '/', expires: 7 });
alert("Cookie done");
});
});
Libraries:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"> </script>
<script type="text/javascript" src = "https://raw.github.com/carhartl/jquery-cookie/master/jquery.cookie.js"> </script>
It should save my name and when I hit refresh to show my name. The only problem is when I try to read the cookie, instead of name shows %5Bobject%20Object%5D.
Thank you.
do:
$(document).ready( function(){
var cook = $.cookie('theName'); //get from cookie if exists
if ( cook )
alert(cook);
$('#but').click(function(){
var theName = $('#content').val();
alert(theName);
$.cookie('theName', theName, { expires: 7, path: '/' }); //set the cookie
alert("Cookie done");
});
});
Updated:
try adding:
$.cookie.raw = true;
var cook = $.cookie('theName', { path: '/'});
This overwrites the cookie with the string representation of { path: '/'}.
To actually retrieve the existing cookie just pass the name:
var cook = $.cookie('theName');
There is no point in passing the path anyway - if you are outside the path for which the cookie is set you simply don't get it at all.
Try This.
<!DOCTYPE html>
<html>
<head>
<script>
function getCookie(c_name)
{
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1)
{
c_start = c_value.indexOf(c_name + "=");
}
if (c_start == -1)
{
c_value = null;
}
else
{
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1)
{
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start,c_end));
}
return c_value;
}
function setCookie(c_name,value,exdays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}
function checkCookie()
{
var username=getCookie("username");
if (username!=null && username!="")
{
alert("Welcome again " + username);
}
else
{
username=prompt("Please enter your name:","");
if (username!=null && username!="")
{
setCookie("username",username,365);
}
}
}
</script>
</head>
<body onload="checkCookie()">
</body>
</html>
Hope this helps.
Source:Here
Related
When a user click on a button it would take them to a link but before they go to that link, the cookie will need to be set to either English (EN) or French (FR). I got an example here:
http://www.quirksmode.org/js/cookies.html
but for some reason, it's not reading in the cookie and I'm not sure where I'm going wrong.
This is what I have:
<!DOCTYPE html>
<html>
<body>
<p>This is for the Browser Cookies.</p>
<button onclick="EN_Cookie()">English Link</button> <button onclick="FR_Cookie()">French Link</button>
<script>
function EN_Cookie() {
setCookie("SMDCookie","EN",7);
//location.href = 'https://google.com';
}
function FR_Cookie() {
setCookie("SMDCookie","FR",7);
//location.href = 'https://google.com';
}
function setCookie(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=/";
}
</script>
</body>
</html>
Any suggestions??
I reviewed your code and found your set cookie function is correct.
May be your getCookie not working, i am sharing get cookie function:
function getCookie(cname) {
var name = cname + "=";
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);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return "";
}
Here are functions you can use for creating and retrieving cookies
function createCookie(name, value, days) {
var expires;
if (days) {
var date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
expires = "; expires=" + date.toGMTString();
}
else {
expires = "";
}
document.cookie = name + "=" + value + expires + "; path=/";
}
function getCookie(c_name) {
if (document.cookie.length > 0) {
c_start = document.cookie.indexOf(c_name + "=");
if (c_start != -1) {
c_start = c_start + c_name.length + 1;
c_end = document.cookie.indexOf(";", c_start);
if (c_end == -1) {
c_end = document.cookie.length;
}
return unescape(document.cookie.substring(c_start, c_end));
}
}
return "";
}
Copied from How do I create and read a value from cookie with javascript?
Live site- http://chitrchatr.com
I successfully add setCookie function on exit button & another link. So, if anyone close popup or click on that link then cookie will be stored & popup never appears for him/her.
It works perfectly, i close/go to link it, it store cookie but when i try to go another page/link of website it appears again(cookie is already stored but it appers). Any idea how to fix it so it will never appears if anyone go to another page after storing cookie.
My HTML-
<div id="popupBox">
<div id='popupContent' class='visiblebox' style='width:500px;height:446px;z-index:999999;left: 31%; top: 15%;'>
<a onClick="document.getElementById('popupBox').style.display='none'; setCookie('abc', 'def', 1)" href='#' id='closebox' title='Close this box'>X</a>
....
PopUp content here
....
<a onClick="document.getElementById('popupBox').style.display='none'; setCookie('abc', 'def', 1)" href="http://chitrchatr.com/signup-and-win-new-smartphones-and-get-our-service-for-free/" target="_blank"><img class="alignnone size-full wp-image-1548" alt="Promotion_06" src="http://chitrchatr.com/wp-content/uploads/2014/01/Promotion_06.png" width="243" height="61" /></a>
</div>
</div>
Javascript-
<script type="text/javascript">
function setCookie(c_name,value,exdays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}
function getCookie(c_name)
{
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1)
{
c_start = c_value.indexOf(c_name + "=");
}
if (c_start == -1)
{
c_value = null;
}
else
{
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1)
{
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start,c_end));
}
return c_value;
}
if(getCookie('abc')=="def" && document.getElementById('popupBox'))
document.getElementById('popupBox').style.display='none';
</script>
add path to your cookie
function setCookie(name, value, days, secure) {
var expires = '';
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
expires = '; expires='+date.toGMTString();
}
var domain = locDomain;
document.cookie = name + '='+escape(value) + expires + '; path=/' + (domain ? '; domain=.' + domain : '') + ((secure && locProtocol == 'https:') ? '; secure' : '');
}
Try setting the location of cookie as '/'
Im currently using a javascript code to check for a cookie and its working. But I want the user to be directed to another page once they have entered in their user ID (cookie). Is there another function that I can add so that the user can be directed to another page once I have the cookie? The code is set up where they wont see this window for a year.
I'm not sure what to add. Please help.
<script>
function getCookie(c_name) {
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1) {
c_start = c_value.indexOf(c_name + "=");
}
if (c_start == -1) {
c_value = null;
} else {
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1) {
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start, c_end));
}
return c_value;
}
function setCookie(c_name, value, exdays) {
var exdate = new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value = escape(value) + ((exdays == null) ? "" : "; expires=" + exdate.toUTCString());
document.cookie = c_name + "=" + c_value;
}
function checkCookie() {
var username = getCookie("username");
if (username != null && username != "") {
alert("Welcome again " + username);
} else {
username = prompt("Please enter your name:", "");
if (username != null && username != "") {
setCookie("username", username, 365);
}
}
}
</script>
if(localStorage.beenHere){
//Been here before
}else{
localStorage.beenHere = 1;
}
Hello I am using Reveal popup plugin combined with cookies to show popup only once a day.
This is my code
<head>
..
<script type="text/javascript">
function setCookie(c_name, value, exdays) {
var exdate = new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value = escape(value) + ((exdays == null) ? "" : "; expires=" + exdate.toUTCString());
document.cookie = c_name + "=" + c_value;
}
function getCookie(c_name) {
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1) {
c_start = c_value.indexOf(c_name + "=");
}
if (c_start == -1) {
c_value = null;
}
else {
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1) {
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start, c_end));
}
return c_value;
}
function showModal() {
// Check if cookie existes
var expireDate = getCookie("showpopup");
var today = new Date().toUTCString();
if (expireDate != null && expireDate > today) {
//Do nothing!
}
else {
//ShowPopup here!
$('a.reveal-link').trigger('click');
//Create cookie
setCookie("showpopup", "anything", 1);
}
}
</script>
</head>
<body onLoad="showModal()">
Click Me For A Modal
<div id="myModal" class="reveal-modal">
<h1>Modal Title</h1>
<p>Any content could go in here.</p>
<a class="close-reveal-modal">×</a>
</div>
...other code
</body>
So basicaly on page load, the cookie is created but no popup shows. When I manualy click on link "Click Me For A Modal", window is shown so there is no problem with window. When I tried javascript alert message that worked.
The important part of code is:
//ShowPopup here!
$('a.reveal-link').trigger('click');
I have tried diffrent variations for start the script like $('#myModal').foundation('reveal', 'open'); or $('#myModal').reveal(); but nothing worked.
Can you help me ?
Thanks
I´ve found it. The problem just occur on my page due more jquery libraries in conflict.
I am working on a login page for a project and I am wondering how I would go about setting a cookie just to remember the username ?
Here is the sample code. for html Cookies.
<!DOCTYPE html>
<html>
<head>
<script>
function getCookie(c_name)
{
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1)
{
c_start = c_value.indexOf(c_name + "=");
}
if (c_start == -1)
{
c_value = null;
}
else
{
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1)
{
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start,c_end));
}
return c_value;
}
function setCookie(c_name,value,exdays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}
function checkCookie()
{
var username=getCookie("username");
if (username!=null && username!="")
{
alert("Welcome again " + username);
}
else
{
username=prompt("Please enter your username:","");
if (username!=null && username!="")
{
setCookie("username",username,365);
}
}
}
</script>
</head>
<body onload="checkCookie()">
</body>
</html>