JavaScript 中的 Cookie 无法正常工作

Cookies In JavaScript not working Properly

本文关键字：工作常工作中的 Cookie JavaScript 更新时间：2023-09-26

我正在尝试在Javascript中使用cookie，但它不起作用。我不明白这个问题。下面是我的代码。请帮忙。

索引.jsp

   <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org 
                                                          /TR/html4/loose.dtd">
   <html>
   <head>
   <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
   <title>WelcomePage</title>
   <script type="text/javascript">
   function setCookie()
   {
     var name= document.getElementById("username").value;
     var expires="";
     if(name=="")
     {
          alert("Please Enter A Valid Name");
          return false;
     }
     else
     {
          var date = new Date();
          date.setTime(date.getTime()+ (2*24*60*60*1000));
          expires = "; expires= "+ date.toGMTString();
          var cookieExp = "name="+name+expires+"; path=/";
          alert(cookieExp);
          document.cookie(cookieExp);
          form.submit();
     }
   }
   </script>
   </head>
   <body bgcolor="#C0C0C0">
   <hr size="1"width="1200">
   <form method= "post" action="Second.html">
   <table align="center">
   <tr>
   <td align="center">Enter Name: </td>
   <td><input type="text" size="10" id="username" name= "user"></td>
  <td align="center"><input type="submit"value="submit" onclick="return setCookie();"> 
   </td>
   </tr>
   </table>
   </form>
   <hr size="1"width="1200">
   </body>
   </html>

这是我的第二页，我正在尝试检索cookie，但警报框返回未定义的值。

第二.html

   <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org 
                                                                 /TR/html4/loose.dtd">
   <html>
   <head>
   <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
   <title>2ndPage</title>
   <script type="text/javascript">
   function getCookie()
   {
     var allCookies = document.cookie;
     alert("All Cookies: "+allCookies);
     cookieArray = allCookies.split(';');
     for(var i=0;i<cookieArray.length;i++)
     {
        name = cookieArray[i].split("=")[0];
        value = cookieArray[i].split("=")[1];
        alert("Key is: "+name+" Value is: "+value);
     }
  }
  </script>
  </head>
  <body bgcolor="#C0C0C0" onload="getCookie();">
  <hr size="1"width="1200">
 <br><br>
 <hr size="1"width="1200">
 </body>
 </html>

几个问题

document.cookie 不是一个函数 - document.cookie(cookieExp)更改为像您应该的那样document.cookie=cookieExp或使用库
不要在提交事件中提交表单

 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org 
                                                      /TR/html4/loose.dtd">
 <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>WelcomePage</title>
<script type="text/javascript">
function setCookie(name,val) {
  var date = new Date();
  date.setTime(date.getTime()+ (2*24*60*60*1000));
  expires = "; expires= "+ date.toGMTString();
  var cookieExp = name+"="+value+expires+"; path=/";
  alert(cookieExp);
  document.cookie=cookieExp;
}
window.onload=function() {
  document.getElementById("form1").onsubmit=function() {
    var name=document.getElementById("username").value;
    if(name=="") {
      alert("Please Enter A Valid Name");
      return false;
    }
    setCookie("name",name);
    return true;
  }
}
</script>
</head>
<body bgcolor="#C0C0C0">
<hr size="1"width="1200">
<form id="form1" method= "post" action="Second.html">
<table align="center">
<tr>
<td align="center">Enter Name: </td>
<td><input type="text" size="10" id="username" name= "user"/></td>
<td align="center"><input type="submit" value="submit" /> 
</td>
</tr>
</table>
</form>
<hr size="1"width="1200">
</body>
</html>

希望对您有所帮助，请使用

 document.cookie = cookieExp;

而不是document.cookie(cookieExp);

您可以尝试像这样设置 cookie：

document.cookie = cookieExp;