如何解决Javascript 输入值返回未定义待办事项列表程序
在过去的一天里,我一直在用头撞墙,我就是无法让它发挥作用 每次我尝试创建待办事项列表时,它都会返回未定义,我似乎无法检测到代码出了什么问题 我还在学习过程中,请放轻松
function addToList() {
var item = document.getElementById("candidate").Value;
var text = document.createTextNode(item);
var li = document.createElement("li");
li.appendChild(text);
document.getElementById("todoList").appendChild(li);
}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="/css/style.css" />
<Meta charset="UTF-8" />
<Meta http-equiv="X-UA-Compatible" content="IE=edge" />
<Meta name="viewport" content="width=device-width,initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<section>
<div class="container">
<div class="userTodoList">
<input id="candidate" class="userInput" type="text" placeholder="New List..." />
<button onclick="addToList()">Add</button>
</div>
<div class="addedLists">
<ul id="todoList"></ul>
</div>
</div>
</section>
</body>
<script src="JS/Script.js"></script>
</html>
解决方法
这一定很令人沮丧。您为 value
使用了大写的 V。
.Value
是无效的属性。您正在寻找.value
function addToList() {
var item = document.getElementById("candidate").value;
var text = document.createTextNode(item);
var li = document.createElement("li");
li.appendChild(text);
document.getElementById("toDoList").appendChild(li);
}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="/css/style.css" />
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<section>
<div class="container">
<div class="userToDoList">
<input id="candidate" class="userInput" type="text" placeholder="New List..." />
<button onclick="addToList()">Add</button>
</div>
<div class="addedLists">
<ul id="toDoList"></ul>
</div>
</div>
</section>
</body>
<script src="JS/Script.js"></script>
</html>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。