嗨，我正在尝试做一个登录程序，只验证用户名，所以当我试图将用户输入从html传递到javascript时，它会将其作为null，有人知道为什么吗？给我这个错误消息：Login2.js:12
Uncaught TypeError: Cannot read properties of null (reading 'value')
at HTMLButtonElement.document.getElementById.onclick (Login2.js:12:55)于飞：
<!DOCTYPE html>
<html>
<head>
<title>StudySkillsApp Log-in</title>
</head>
<body>
<label><b>Username:</b></label>
<input placeholder="Enter Username" id={"myText"}>
<button type="button" id="myButton"> SIGN IN </button>
<script src="Login2.js">
</script>
</body>
</html>和Login2.js（javascript是）：
if(document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', afterLoaded);
} else {
//The DOMContentLoaded event has already fired. Just run the code.
afterLoaded();
}
function afterLoaded(){
//Your initialization code goes here. This is from where your code should start
// document.readyState === "complete")
document.getElementById("myButton").onclick = function(){
var myName = document.getElementById("myText").value;
console.log(myName);
}
};
2条答案
按热度按时间41ik7eoe1#
您需要从HTML代码中删除{}方括号。在输入标记中，将
id={"myText"}替换为id="myText"它将解决问题。
nwsw7zdq2#
我在处理我的项目时遇到了同样的错误。如果你确信一切都是正确的，但仍然得到错误，最有可能的是你的外部js文件试图在DOM准备好之前到达DOM元素。你应该在你的
script标签中使用defer或async。当在
<body>的末尾添加<script>标记时，它也可以工作（不推荐用于长HTML文档，因为可能会有明显的延迟）。