Question

我使用html和javascript创建了一个注册表和一个登录表单。我将用户数据存储在数组中然后存储在本地存储中的位置。为此，我最初声明了一个名为var users = []的空数组; 因此，当页面重新加载时，先前存储的数据丢失，因为阵列再次变空并且本地存储器中的数据被覆盖。请帮忙，重新加载页面后如何避免数组变空。

以下是我的controller.js -

//Declaring an empty array
var users = [];

//Setting id for each users
var idInput = makeCounter();

//Fetching data from textboxes in register.html
var firstnameInput  = document.getElementById("firstname");
var lastnameInput   = document.getElementById("lastname");
var emailInput      = document.getElementById("email");
var usernameInput   = document.getElementById("username");
var passwordInput   = document.getElementById("password");
var dobInput        = document.getElementById("dob");
var messageBox      = document.getElementById("editeddata");

//Declaring custom constructor function
function userdetails(id, firstname, lastname, email, dob, username, password){
    this.id         = id;
    this.firstname  = firstname;
    this.lastname   = lastname;
    this.email      = email;
    this.dob        = dob;
    this.username   = username;
    this.password   = password;
    this.FullName   = this.firstname +' ' + this.lastname;
}

//counter funtion, to fetch user id
function makeCounter() {
    var arraylength=users.length;
    return function(){
        return arraylength+1;
    }
}

//insert data while registration
function registerUser()
{
    //Email validation
    var emailinput = document.forms["myform"]["email"].value;
    var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
    if(!(emailinput).match(emailReg) || emailinput=="")
    {
        alert("Not a valid e-mail address");
        return false;

    }
    //check, if fields are empty
    if(firstnameInput.value=="" || lastnameInput.value=="" || passwordInput.value=="" || dobInput.value=="")
    {
        alert("Fields cannot be empty");
        return false;
    }

    //check, if a user already exist
    var usernameinput = document.forms["myform"]["username"].value;
    var passwordinput = document.forms["myform"]["password"].value;
    var ulen= users.length;
    for(i=0; i < ulen; i++)
    {
        if ( usernameinput == users[i].username && passwordinput == users[i].password)
        {
            alert("User already exists");
            return false;
        }
    }

    var user=new userdetails(idInput(),firstnameInput.value, lastnameInput.value, emailInput.value, dobInput.value, usernameInput.value, passwordInput.value);
    users.push(user);
    alert("Registered successfully");
    localStorage.setItem("key_users", JSON.stringify(users));

}

Answer 1

您可以在初始化时使用本地存储值。

if (typeof(Storage) !== "undefined") {
  if (localStorage.key_users) {
    users = localStorage.key_users;
  } else {
    users = [];
  }
}

Answer 2

你可以使用这样的东西来检查密钥是否已经在localStorage中。

<html>
  <head>

    <link href="style.css" rel="stylesheet">
  </head>
  <body onload="test()">


    <script>
    function test(){
        var value = (localStorage.getItem("key1"))
        console.log(value)
       if(value == null){
           localStorage.setItem("key1","value1")
           alert("Hellow")
       }else{
           var value=localStorage.getItem("key1");
           alert(value)
       }

    }


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

即使页面重新加载，如何使用javascript将数据保存在数组中？

2 个答案: