Question

我正在尝试创建一个存储用户名的数组，然后将其打印到控制台。但是，当我刷新页面并点击提交时，上次的用户名不存在。

这是我的代码：

var users = [];
function User(first_name, last_name, username, password, email,            birthday_month, birthday, birthday_year){
    this.first_name = first_name;
    this.last_name = last_name;
    this.username = username;
    this.password = password;
    this.email = email;
    this.birthday_month = birthday_month;
    this.birhday = birthday;
    this.birthday_year = birthday_year;
}
var Msg = document.getElementById("Msg");
function Submit(){
    var a = document.forms["form"]["First_Name"].value;
    var b = document.forms["form"]["Last_Name"].value;
    var c = document.forms["form"]["Username"].value;
    var d = document.forms["form"]["Password"].value;
    var l = document.forms["form"]["Email"].value;
    var month = document.forms["form"]["birthday_month"].value;
    var day = document.forms["form"]["birthday"].value;
    var year = document.forms["form"]["birthday_year"].value;
    localStorage.setItem("fn", a);

    var ln = localStorage.b;
    var u = localStorage.c;
    var p = localStorage.d;
    var e = localStorage.l;
    var m = localStorage.month;
    var d = localStorage.day;
    var y = localStorage.year;


    if (ln == null || ln == "" || u == "" || u == null || p == "" || p == null || e == null || e == "" || m == "Month" || d == "Day" || y == "Year") {
        Msg.textContent = "Please fill out all information correctly!";
        return false;
    } else {
        var account = new User(ln, u, p, e, m, d, y);
        var wha = localStorage.getItem("fn");
        users.push(wha);
        Msg.textContent = "Registration succesful!"
        console.log(users);
    }

}

Answer 1

我认为代码存在一些问题，第一个问题是拥有有意义的变量名称。命名变量a，b，c，d正在寻找麻烦。

在提交功能中

var ln = localStorage.b;
var u = localStorage.c;
var p = localStorage.d;
var e = localStorage.l;
var m = localStorage.month;
var d = localStorage.day;
var y = localStorage.year;

我不确定这里发生了什么;如果你认为这是保存到localStorage或从localStorage获取，你就错了。

在if语句的条件下，我会使用＆＃34; ===＆＃34;相反＆＃34; ==＆＃34;确保javascript在尝试查明它们是否相等时不会转换类型，尤其是在与null或＆＃34;＆＃34;进行比较时。

保存到localStorage时，请记住只能存储字符串，可以使用setItem（name，value）;例如

localStorage.setItem("firstName", "James");

您可以通过以下方式检索该信息：

var fname = localStorage.getItem("firstName");

如果你想存储一个对象，你需要将它转换为一个字符串，这可以使用JSON.stringify（）完成，所以让我们说你有这个用户：

var firstUser = new User("fname", "lname", "uname", "pass", "email", 12, 4, 2000);

你可以这样存储：

localStorage.setItem("firstUser", JSON.stringify(firstUser));

然后您可以按照以下方式检索它：

var storedUser = JSON.Parse(localStorage.getItem("firstUser"));

希望有所帮助！

Answer 2

您的代码似乎有几处错误。函数submint()的逻辑是，每次点击此函数时，都会从form获取一系列数据，并将fn的项localStorage设置为新值document.forms["form"]["First_Name"].value。

因此，现在的工作流程是，当您刷新页面时，点击submit功能，您将获得form中的数据，并且每次都覆盖localStorage.fn。您永远无法获得localStorage中存储的最后一个值。

您可以尝试将submit()功能分开，将商店用户名的逻辑拆分为单独的功能。

为什么本地存储不起作用？

2 个答案: