Question

当用户在文本字段中输入文本并单击提交按钮时，他们的文本应出现在屏幕上。现在没有任何表现。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<script>
function myOnloadFunc() {
    var inputAnswer = document.getElementById("inputAnswer");
    var userAnswer = inputAnswer.innerHTML;

    var submitButton = document.getElementById("submitButton");

    submitButton.onclick = function() {
        document.write(userAnswer);
    };
}

window.onload = myOnloadFunc;
</script>
</head>

<body>
<input type="text" id="inputAnswer" placeholder="Enter your answer">
<input type="button" id="submitButton" value=">">
</body>
</html>

Answer 1

input元素没有任何后代，因此.innerHTML返回一个空字符串。如果您想获取该值，则必须访问.value属性（有关详细信息，请参阅HTMLInputElement documentation on MDN）。

另一个问题是，您尝试在用户实际键入任何内容之前获取值。您不希望在页面加载上获取值，但是当用户单击按钮时：

submitButton.onclick = function() { console.log(inputAnswer.value); // or alert(inputAnswer.value); };

我会避免使用document.write，即使它仅用于测试目的。至少understand what happens when you call it after the DOM was loaded。

JavaScript - 无法获取表单输入值

1 个答案: