Question

我想这样做，当用户返回页面时，应该读取cookie并使用保存的cookie值恢复单个表单字段值。我有一个createCookie（）和readCookies（）函数，但我卡住了，不知道如何继续。现在页面保存了cookie，但现在我需要将表单字段恢复为重新访问页面时保存的cookie中的值。

<html>
<body>
<form id="registration">
<input name="fname" id="fname">
<input name="lname" id="lname">
<input id="street" name="street" type="text">
<input id="city" name="city" type="text">
<select id="state" name="state"><option value="" selected="selected">Choose</option>
<input id="zip" name="zip" type="text">
<input name="email" id="email">
( <input id="phone1" name="phone1" size="3"> )
  <input id="phone2" name="phone2" size="3"> - 
  <input id="phone3" name="phone3" size="4">
</form>

<script type="text/javascript>

var regForm = document.getElementById("registration");
var fname = document.getElementById("fname").value;
var lname = document.getElementById("lname").value;
var street = document.getElementById("street").value;
var city = document.getElementById("city").value;
var state = document.getElementById("state").value;
var zip = document.getElementById("zip").value;
var email = document.getElementById("email").value;
var phone1 = document.getElementById("phone1").value;
var phone2 = document.getElementById("phone2").value;
var phone3 = document.getElementById("phone3").value;

function createCookie(name, value, days) {
    if (days) {
        var date = new Date();
        date.setTime(date.getTime() + (days*24*60*60*1000));
        var expires = "; expires=" + date.toUTCString();
    } 
    else {
        var expires = "";
    }
    document.cookie = name+"="+value + expires;
    alert("Cookie being created " + document.cookie);
}
function readCookies() {
    var myCookie = document.cookie;
    var newCookie = unescape(myCookie);
    var pairs = newCookie.split("=");
    var name = pairs[0];
    var value = pairs[1];
    alert(newCookie);
}

readCookies();

</script>
</body>
</html>

我有警报（newCookie）;所以我知道读取功能是否正常工作。我需要帮助找出如何在页面加载时将cookie发送回表单字段。

Answer 1

有更好的方法可以做到这一点，例如在HTML5中添加的sessionStorage。但更大的问题是你必须决定何时保存这些值。最佳解决方案可能是将侦听器附加到每个输入，并在失去焦点时保存值（用户单击其他内容 - 表示他/她已完成此字段）。

然后添加一个在页面加载时运行的脚本，只设置存储中存在的每个输入值。 document.getElementById("registration").value = theValueFromStorage;

检索cookie并放置在表单javascript中

1 个答案: