javascript sets and gets cookie method example details

  • 2020-11-18 06:07:47
  • OfStack

This article gives an example of how to set up javascript and get cookie. To share for your reference, the details are as follows:

1. Set the cookie


function setCookie(cookieName,cookieValue,cookieExpires,cookiePath)
{
  cookieValue = escape(cookieValue);// coding latin-1
  if(cookieExpires=="")
  {
    var nowDate = new Date();
    nowDate.setMonth(nowDate.getMonth()+6);
    cookieExpires = nowDate.toGMTString();
  }
  if(cookiePath!="")
  {
    cookiePath = ";Path="+cookiePath;
  }
  document.cookie= cookieName+"="+cookieValue+";expires="+cookieExpires+cookiePath;
}

2. Obtain cookie


function getCookieValue(cookieName)
{
  var cookieValue = document.cookie;
  var cookieStartAt = cookieValue.indexOf(""+cookieName+"=");
  if(cookieStartAt==-1)
  {
    cookieStartAt = cookieValue.indexOf(cookieName+"=");
  }
  if(cookieStartAt==-1)
  {
    cookieValue = null;
  }
  else
  {
    cookieStartAt = cookieValue.indexOf("=",cookieStartAt)+1;
    cookieEndAt = cookieValue.indexOf(";",cookieStartAt);
    if(cookieEndAt==-1)
    {
      cookieEndAt = cookieValue.length;
    }
    cookieValue = unescape(cookieValue.substring(cookieStartAt,cookieEndAt));// decoding latin-1
  }
  return cookieValue;
}

Example:


<!doctype html>
<html>
<head>
<title>cookie</title>
<meta charset="utf-8">
<script language="javascript" type="text/javascript">
  // To obtain cookie
   function getCookieValue(cookieName)
  {
    var cookieValue = document.cookie;
    var cookieStartAt = cookieValue.indexOf(""+cookieName+"=");
    if(cookieStartAt==-1)
    {
      cookieStartAt = cookieValue.indexOf(cookieName+"=");
    }
    if(cookieStartAt==-1)
    {
      cookieValue = null;
    }
    else
    {
      cookieStartAt = cookieValue.indexOf("=",cookieStartAt)+1;
      cookieEndAt = cookieValue.indexOf(";",cookieStartAt);
      if(cookieEndAt==-1)
      {
        cookieEndAt = cookieValue.length;
      }
      cookieValue = unescape(cookieValue.substring(cookieStartAt,cookieEndAt));// decoding latin-1
    }
    return cookieValue;
  }
  // Set up the cookie
  function setCookie(cookieName,cookieValue,cookieExpires,cookiePath)
  {
    cookieValue = escape(cookieValue);// coding latin-1
    if(cookieExpires=="")
    {
      var nowDate = new Date();
      nowDate.setMonth(nowDate.getMonth()+6);
      cookieExpires = nowDate.toGMTString();
    }
    if(cookiePath!="")
    {
      cookiePath = ";Path="+cookiePath;
    }
    document.cookie= cookieName+"="+cookieValue+";expires="+cookieExpires+cookiePath;
  }
  // Page load time handler 
  function window_onload()
  {
    var userNameElem = document.getElementById("userName");// User name input box object 
    var passwordElem = document.getElementById("password");// Password entry box object 
    var currUserElem = document.getElementById("currUser");// Check box object 
    var currUser = getCookieValue("currUser");
    if(currUser!=null)
    {
      userNameElem.value=currUser;
      currUserElem.checked = true;
    }
    if(userNameElem.value!="")
    {
      passwordElem.focus();// The password field gets focus 
    }
    else
    {
      currUserElem.focus();// The user name input box gets focus 
    }
  }
  // Form submission processing 
  function login()
  {
    var userNameElem = document.getElementById("userName");
    var passwordElem = document.getElementById("password");
    var currUserElem = document.getElementById("currUser");
    if(userNameElem.value=="" || passwordElem.value=="")
    {
      alert(" User name or password cannot be empty! ");
      if(userNameElem.value=="")
      {
        userNameElem.focus();// The user name input box gets focus 
      }
      else
      {
        passwordElem.focus();// The password field gets focus 
      }
      return false;
    }
    if(currUserElem.checked)
    {
      setCookie("currUser",userNameElem.value,"","");// Set up the cookie
    }
    else
    {
      var nowDate = new Date();// The current date 
      nowDate.setMonth(nowDate.getMonth()-2);// will cookie The expiration time is set to a previous date 
      cookieExpires = nowDate.toGMTString();// The format of the expiration time must be GMT Date format 
      setCookie("userName","",cookieExpires,"");// delete 1 a cookie Simply set the expiration time to the past 1 Within a few minutes 
    }
    return true;
  }
</script>
<style type="text/css">
  div{
    font-size:12px;
  }
</style>
</head>
<body onload="window_onload()">
<div>
<form id="loginForm" onsubmit="return login()">
 User name: <input type="text" id="userName"><br>
 The secret   Code: <input type="password" id="password">
<input type="checkbox" id="currUser"> Remember user name <br>
<input type="submit" value=" The login ">
</form>
</div>
</body>
</html>

Note:

Since the google Chrome browser only supports ES20en-ES21en for security purposes, it is not effective in local testing and needs to be uploaded to the server to try 1.

For more information about JavaScript operation cookie, please refer to JavaScript Operation cookie related knowledge Summary and cookie Operation Skills Summary

I hope this article has been helpful in JavaScript programming.


Related articles: