로컬 저장소가 작동하지 않는 이유는 무엇입니까?

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 문에 대한 조건에서 "==="대신 "=="를 사용하여 자바 스크립트가 유형을 동일하지 않은지 알아 내려고 변환하지 않도록하십시오. 특히 null과 비교할 때 또는 "".

localStorage에 저장할 때 문자열을 저장할 수 있다는 것을 명심하십시오. setItem (name, value); 예를

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

당신은 다음과 같이 수행하여 해당 정보를 검색 할 수 있습니다 : 객체를 저장하려면

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

, 당신은 JSON을 사용하여 수행 할 수있는 문자열로 변환해야합니다.

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

당신이 그런 식으로 저장할 수 있습니다 :

캐릭터 라인 화(), 그래서이 사용자가 있다고 가정 해 보자

당신은 다음과 같이 그것을 검색 할 수 있습니다

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

희망을!

Answer 2

코드에 몇 가지 실수가있는 것으로 보입니다. 함수 submint()의 논리는이 함수를 실행할 때마다 form에서 일련의 데이터를 가져오고 fn이 localStorage 인 값을 document.forms["form"]["First_Name"].value의 새 값으로 설정한다는 것입니다. 페이지를 새로 고침 할 때

그래서, 작업 흐름 지금, 당신은 form의 데이터를 얻을, 그리고 localStorage.fn 때마다 덮어 쓰게됩니다의 submit 기능을했다. 마지막 값을 localStorage에 저장할 수 없습니다.

submit() 기능을 분리하고 상점 사용자 이름의 논리를 분리하고 사용자 이름을 개별 기능으로 가져올 수 있습니다.