I"m trying to follow a tutorial online on how to make a Todo list
I finished the following code as follows
<!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: 5px 10px; color: #000; }
li span { padding-left: 10px; cursor: default;}
.checked { text-decoration: line-through; font-weight: bold; color: #c00;}
</style>
</head>
<body>
<h1>To Do List</h1>
<p><iput type="text" id="inItemText"/>
<ul id= "todolist">
</ul>
<script type= "text/javascript" src="todo.js"</script>
</body>
</html>
and
// Each item should look like <li><input type = "checkbox"/> do tutorial</li>
function updateItemStatus (){
var cbId = this.id.replace("cb_","");
var itemText = document.getElementbyId("item_" + cb.Id);
if (this.checked) {
itemText.className = "checked";
} else {
itemText.style.fontWeight = "";
}
}
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");
list.Item.id = "li_" + id;
var checkbox = document.createElement("input");
checkbox.type = "checkbox";
checkbox.id = "cb_" + id;
checkBox.oneclick = updateItemStatus;
var span = document.createelement("span");
span.id = "item_" + id;
span.innertext = itemText;
span.ondblclick = removeItem;
listItem.appendChild(checkbox);
listItem.appendChild(span)
list.appendChild(listItem);
}
var inItemText = document.getElementbyId("inItemText");
inItemText.focus();
inItemText.onkeyup = function (event) {
// 13 means Enter
if (event.which == 13) {
var itemText = event.which;
if (itemText == "" || itemText == " ") {
return false;
}
addNewItem(document.getElementById("todolist") itemText);
inItemText.focus();
inItemText.select();
};
I have both files saved in the save folder on my desktop. The javascript is still not coming up. Did I type something in wrong. I'm just trying how to link the javascript to my html sorry its my first time doing this.
shreesh chandra shukla
19-Aug-2013you forgot >
<script type= "text/javascript" src="todo.js"></script>
now it will work