好吧，终于快完成本教程了，我在最后一部分，我可以单击跨度上的元素使它们消失，我单击它们并且它们没有消失有人知道为什么吗？这是我的代码
<!doctype html>
<html>
<head>
<title>To do list with html and javascript</title>
<style>
ul { list-style: none; padding: 0; margin: 0; width: 400px;}
li { border: 1px solid #ccc; background: #eee; padding: 10px 15px; color: #000; }
li span { padding-left: 10px;}
.checked { text-decoration: line-through; font-weight: bold; color: #c00;}
</style>
</head>
<body>
<h1>To Do List</h1>
<p><input type="text" id="inItemText"/></p>
<ul id="todolist">
</ul>
<script src="todo.js"></script>
</body>
</html>
和
function updateItemStatus() {
var cbId = this.id.replace("cb_","");
var itemText = document.getElementById("item_" + cbId);
if (this.checked) {
itemText.className = "checked";
} else {
itemText.className = "";
}
}
function removeItem() {
var spanId = this.id.replace("item_" + "");
document.getElementById("li_" + spanId).style.display = "none";
}
function addNewItem(list, itemText){
var date = new Date();
var id = "" + date.getHours() + date.getMinutes() + date.getSeconds() + date.getMilliseconds();
var listItem = document.createElement
("li");
listItem.id = "li_" + id;
var checkBox = document.createElement ("input");
checkBox.type = "checkbox";
checkBox.id = "cb_" + id;
checkBox.onclick = updateItemStatus;
var span = document.createElement("span");
span.id = "item_" + id;
span.innerText = itemText;
span.onclick = removeItem;
listItem.appendChild(checkBox);
listItem.appendChild(span);
list.appendChild(listItem);
}
var inItemText = document.getElementById("inItemText");
inItemText.focus();
inItemText.onkeyup = function(event) {
if (event.which == 13) {
var itemText = inItemText.value;
if (!itemText || itemText == "undefined") {
return false;
}
addNewItem(document.getElementById("todolist"), itemText);
inItemText.focus();
inItemText.select();
};
}
最佳答案
您的代码中似乎有拼写错误。 replace 方法接受两个由 逗号 分隔的参数。在您的代码中有一个 + 符号而不是 ,。
使用下面的代码。 Working Sample
function removeItem() {
var spanId = this.id.replace("item_", ""); //Note the change
console.log(this.id + spanId);
document.getElementById("li_" + spanId).style.display = "none";
}
关于javascript - 当我在跨度 Javascript 上单击它们时，元素不会消失，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18284725/