javascript - 无法读取 'null' 的属性值

Question

我试图让变量 userName 保留在输入 name_enter 中输入的任何值。但是当我尝试这样做时，我只会收到控制台错误:

未捕获类型错误:无法读取 null 的属性“值”

function questionName() {
    document.write("<p>Hi my name is Bot9000. What is your name?</p><input type='text' id='name_enter' /><input type='button' value='Enter' onClick='verifyName();' />");
}

var userName = document.getElementById("name_enter").value;

function verifyName() {
    document.write("<p>Your name is " + userName + "?</p>");
    document.write("<input type='button' value='Yes' onClick='nameVerified();' /> <input type='button' value='No' onClick='questionName();' />");
}

function nameVerified() {
    document.write("Nice to meet you " + userName + ". <br />Do you have any Hobbies?");
}

Answer 1

在调用函数 questionName 并将表单添加到页面之前，您需要获取 name 的值。

尝试

function questionName() {
    document.write("<p>Hi my name is Bot9000. What is your name?</p><input type='text' id='name_enter' /><input type='button' value='Enter' onClick='verifyName();' />");
}



function verifyName() {
    var userName = document.getElementById("name_enter").value;
    document.write("<p>Your name is " + userName + "?</p>");
    document.write("<input type='button' value='Yes' onClick='nameVerified();' /> <input type='button' value='No' onClick='questionName();' />");
}

function nameVerified() {
     var userName = document.getElementById("name_enter").value;
    document.write("Nice to meet you " + userName + ". <br />Do you have any Hobbies?");
}