验证Cookie是否存在并存储信息

Verify if Cookie exists and storing the information

本文关键字：存储 信息 存在 Cookie 是否 验证      更新时间：2023-09-26

我是Javascript/Ajax的新手，我正在尝试使用cookie存储用户的名称。我有一个表单，并希望记住人的名字(id = firstName)。如果他们过去已经填写过，我想在他们下次访问页面时在span元素中显示他/她的名字。

这就是我想用伪代码做的。我希望这是清楚的....

如果cookie (called name)存在，在标签元素"span"中显示该信息

其他

在用户填写表单时存储该cookie

(我有一个输入type="submit"作为我的按钮，如果这很重要的话)

@banana现在我修改了我的代码，以匹配我所有的标签名称和id。但是，如果我在表单中输入名称，提交后再返回页面，则span中没有显示任何内容。

function setCookie(cname, cvalue, milliseconds) {
    var d = new Date();
    d.setTime(d.getTime() + (milliseconds));
    var expires = "expires=" + d.toGMTString();
    document.cookie = cname + "=" + cvalue + "; " + expires;
}
function getCookie(cname) {
    var name = cname + "=";
    var ca = document.cookie.split(';');
    for (var i = 0; i < ca.length; i++) {
        var c = ca[i].trim();
        if (c.indexOf(name) == 0) return c.substring(name.length, c.length);
    }
    return "";
}
document.onload = checkIfCookieExists;
function checkIfCookieExists(){
var firstNameFromCookie = getCookie('firstName');
if(firstNameFromCookie == ''){
   // cookie wasnt set
}
else{
   // cookie was set
   var display = document.getElementsByTagName('span');
   display.innerHTML = firstNameFromCookie;
}
}
function init(){
 var firstName = document.getElementById('firstName');
 var cookieExpieryTimeInMilliseconds = 1000 * 60 * 60; //1000 milliseconds * 60 seconds * 60 minutes - results in 1 hour time.
 setCookie('firstName',firstName ,cookieExpieryTimeInMilliseconds );
}
window.onload = init();

要读取cookie，可以使用Zeus.js的内置zeus.getCookie()函数。
zeus.getCookie()是这样工作的:

  • 所有cookie都被压扁成一个字符串，document.cookie
  • zeus.getCookie()从字符串
    • 中选择所需的键。
  • 返回一个字符串。

例如，您设置了一个cookie document.cookie = "like=trains"，您可以使用zeus.getCookie("like")返回值trains(作为字符串)。

要使用Zeus.js，只需输入 
<script src="https://rawgithub.com/thetakeaway/zeus.js/master/zeus.js"></script>

in <head></head> .

干杯!

使用这些来处理cookie。简单地用你想要的名字getCookie，看看你是否得到一个空值。

客户端:

function setCookie(cname, cvalue, milliseconds) {
        var d = new Date();
        d.setTime(d.getTime() + (milliseconds));
        var expires = "expires=" + d.toGMTString();
        document.cookie = cname + "=" + cvalue + "; " + expires;
    }
function getCookie(cname) {
        var name = cname + "=";
        var ca = document.cookie.split(';');
        for (var i = 0; i < ca.length; i++) {
            var c = ca[i].trim();
            if (c.indexOf(name) == 0) return c.substring(name.length, c.length);
        }
        return "";
    }
编辑:

document.onload = checkIfCookieExists;
function checkIfCookieExists(){
    var firstNameFromCookie = getCookie('first_name');
    if(firstNameFromCookie == ''){
       // cookie wasnt set
    }
    else{
       // cookie was set
       var yourSpan = document.getElementById('yourSpansID');
       yourSpan.innerHTML = firstNameFromCookie;
    }
}
为了使用上面的函数保存cookie，您只需这样做: 
function whatever_Function_You_Use_To_Submit_Users_Details(){
     var firstName = ... whatever you do to retrieve first name after user inserted in
     var cookieExpieryTimeInMilliseconds = 1000 * 60 * 60; //1000 milliseconds * 60 seconds * 60 minutes - results in 1 hour time.
     setCookie('first_name',firstName ,cookieExpieryTimeInMilliseconds );
}
相关文章：