存储值生成 [object HTMLInputElement]

Question

我有一个 indexedDB 并将其用于登录功能。我正在尝试在用户登录时使用用户信息填充表单。但是该表单使用 [object HTMLInputElement] 而不是用户信息填充。

这是我带用户（db key）访问对象（用户）的地方

编辑这是我运行的站点：http://www3.carleton.ca/clubs/sissa/html5/admin.html 我的站点编辑器会在我保存时对其进行更新，因此在我尝试新事物时站点脚本可能会有所更改。

这是我带用户（db key）访问对象（用户）的地方

function loginCheck(user,pass){    db.transaction("users").objectStore("users").get(user).onsuccess = function(event) {
    var loggedUser = event.target.result;
        if(!loggedUser){
            alert('Sorry, Username does not exist. Please try again.');
        }else if(pass !== loggedUser.pw ){
            alert('Incorrect log in combination. Please try again.');
            }else{loggedIn(loggedUser);}        
    }    
}
function loggedIn(loggedUser){
    var u=loggedUser;
    alert('Welcome '+u.fn+' '+u.ln+' to Macroplay');

    //function to populate fields 
    alert('get values called'); 
    getValues(u);

    //session store     
    var signedin = 'user';
    var username = u.userName;
    newLocal(signedin,username);
    alert('local storage set'); 
}

我使用这个函数 getValues 来存储我想要的对象的各种字段。

编辑：我将变量 test 声明为全局变量并存储了用户的名字 (fn)。警报显示正确的名称，但填充仍然给我未定义。

    var test;
function getValues(loggedUser){
    var u = loggedUser;
    alert('storing first name');
    test = u.fn;
    alert('First name = '+test);
    lName = u.ln; 
    users = u.userName;
    pass = u.pw;
    email = u.em;
    dob = u.dob;
    tel = u.tel;
    bio = u.bio;
    school = u.scl; 
    alert('user values stored');  
    if(u.gender == 'M'){
        gender[0].checked= true ;
    }else{gender[1].checked= true ;}        
}

这是我用来填充给我 [object HTMLInputElement] 的表单的函数

function populateFields(){
    alert('Name of populated field: '+test);
    fName.value = test;
    lName.value = lName;
    users.value = users;
    pass.value = pass;
    email.value = email;
    dob.value = dob;
    tel.value = tel; 
    bio.value = bio;
    terms.disabled = true;
    school.value = school;  
    alert('populate fields done');

    save.value = 'Update';
    signin.innerHTML = 'Log Out';
    registerLabel.innerHTML = 'Account Information';

     //open user info form
    var accountInfo = document.getElementsByTagName('details');
    accountInfo[1].open = open;
}

Answer 1

只看一行：

fName.value = fName

您正在将fName 的value 属性设置为fName 本身。

与其创建大量全局变量，不如直接在populateFields()中使用loggedUser：

fName.value = loggedUser.fn;

编辑：看看your site，我看到了你遗漏的重要部分。 populateFields() 在页面重新加载后被调用。因此，populateFields() 无法访问在页面重新加载之前创建的任何变量。

既然我在帮你做作业，我不想只是把答案放在银盘上给你。诀窍是必须从数据库中检索用户数据，并在调用它之前或从函数内部将其提供给populateFields()。您可以将用户对象作为全局变量使用，但最好将其作为参数传入。

您可能还想取消表单提交：

document.getElementById("loginForm").onsubmit = function (e) {
    e.preventDefault();
}

然后直接从loggedIn() 调用populateFields() 而不是getValues()。