Skip to content

Instantly share code, notes, and snippets.

@chikoski
Created October 16, 2013 23:27
Show Gist options
  • Save chikoski/7016769 to your computer and use it in GitHub Desktop.
Save chikoski/7016769 to your computer and use it in GitHub Desktop.
h2{
color: #333;
font-size: 120%;
font-weight: normal;
margin-top: 3em;
}
h2:first-child{
margin-top: 1em;
}
textarea{
vertical-align: top;
}
label{
vertical-align: top;
margin-right: 0.5em;
}
.form_item{
margin-bottom: 1em;
}
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
<h2>新しいTo Do</h2>
<form>
<div class="form_item">
<label for="todo_title">件名</label>
<input id="todo_title" type="text" placeholder="To Doのタイトル">
</div>
<div class="form_item">
<label for="todo_details">詳細</label>
<textarea id="todo_details"></textarea>
</div>
<div class="form_item">
<input id="todo_create" type="button" value="To Do登録">
</div>
</form>
<h2>現在のTo Do</h2>
<ul id="todo_list"></ul>
</body>
</html>
var addToDo = function(event){
var title =
document.getElementById("todo_title");
var new_todo = {
title: title.value,
timestamp: new Date()
};
var todo_list =
document.getElementById("todo_list");
var new_item =
document.createElement("li");
new_item.textContent = new_todo.title +
" (" +
new_todo.timestamp.toLocaleString() +
" 登録)";
todo_list.appendChild(new_item);
};
var btn = document.getElementById("todo_create");
btn.onclick = addToDo;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment