Question

您好我是JavaScript的新手，正在开展一个项目。当我提交表单，返回页面然后刷新时，我想要保存cookie。我可以把它保存在Firefox和Edge中但不是chrome。有人能告诉我我错过了什么吗？

Javacript：

"use strict";

function processCookie(){
if(document.getElementById("rememberInput").checked){
    document.cookie = "username=" + document.getElementById("usernameinput").value;

}else{
    var expiresDate = new Date();
    expiresDate.setDate(expiresDate.getDate - 7);
    document.cookie = "username=null; expires" + expiresDate.toUTCString();

}


}

function populateInfo(){
    if(document.cookie){
        var uname = document.cookie;
        uname = uname.substring(uname.lastIndexOf("=") + 1);
        document.getElementById("usernameinput").value = uname;

    }

}

function handleSubmit(var evt ){
    if(evt.preventDefault){
        evt.preventDefault();
    }else{
        evt.returnValue = false;
    }
    processCookie();
    document.getElementsByTagName("form")[0].submit();
}

function createEventListener(){
    var loginForm = document.getElementsByTagName("form")[0];
    if(loginForm.addEventListener){
        loginForm.addEventListener("submit",handleSubmit,false);
    }else if(loginForm.attachEvent){
        loginForm.attachEvent("onsubmit",handleSubmit,false);
    }

}

function setUpPage(){
    populateInfo();
    createEventListener();

}

if(window.addEventListener){
    window.addEventListener("load",setUpPage,false);

}else if(window.attachEvent){
    window.attachEvent("onload",setUpPage);

}

HTML：

<!DOCTYPE html>
<html>
<head>

<meta charset="utf-8" />
<meta id="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0">
<title>Hands-on Project 9-2</title>
<link rel="stylesheet" href="styles.css" />
<script src="modernizr.custom.65897.js"></script>
</head>

<body>
<header>
    <h1>
        Hands-on Project 9-3
    </h1>
</header>

<article>
    <div id="errorMessage"></div>
    <form action="results.htm">
        <fieldset id="deliveryinfo">
            <legend>Site Login</legend>
            <label for="usernameinput">Username</label>
            <input type="text" id="usernameinput" name="username" />
            <label for="passwordinput">Password</label>
            <input type="password" id="passwordinput" name="password" />
            <input type="checkbox" id="rememberinput" name="remember" value="remember" />
            <label for="rememberinput" id="rememberlabel">Remember me</label>
        </fieldset>
        <fieldset id="submitbutton">
            <input type="submit" id="submitBtn" value="Login" />
        </fieldset>
    </form>
</article>
<script src="script.js"></script>
</body>
</html>

同样，我感谢您提供的任何帮助。

Answer 1

我建议您使用此库js cookie这将帮助您轻松管理Cookie

Cookies.set('name', 'value', { expires: 7 });
Cookies.get('name');

无法使用JavaScript将Cookie保存在表单中。 Javascript新用户

1 个答案: