| value | comment | HTML 5 |
| button | Trigger an action, compare with <button> tag and <input type="submit"> | ✗ |
| checkbox | Choose multiple values from a list of options, compare with radio | ✗ |
| color | | ✓ |
| date | date (year, month, and day), with no time (sometimes also with time?) | ✓ |
| datetime-local | A control for entering a date and time, without time zone; opening a date picker or numeric wheels for month, day, and year, when active in supporting browsers. | ✓ |
| email | like text input but with format-validation | ✓ |
| file | select one or more local files. accept attribute controls selectable file types. | ✗ |
| hidden | hidden value, used to pass values that are irrelevant for the user to the web server | ✗ |
| image | submit button with an image | |
| month | month and year without timezone | ✓ |
| number | enter a number with a spinner | ✓ |
| password | enter text but with obscured characters | ✗ |
| radio | Chose one value from a list of options, compare with checkbox | ✗ |
| range | Creates a slider that allows to enter a numerical value with a given minimum and maxium, using the mouse | ✓ |
| reset | Reset values in form to default values (Not recommended) | |
| search | | ✓ |
| submit | Submit content of form to web server, compare with <input type="button"> | |
| tel | telephone number | ✓ |
| text | | ✗ |
| time | time without time zone. | ✓ |
| url | enter an URL | ✓ |
| week | week-year number or week number with no time zone | ✓ |
| datetime | obsolete | ✓ |
file
<!DOCTYPE html>
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<title><input type="file"></title>
<script type="text/javascript">
function display_chosen_files(evt) {
var out = document.getElementById('out');
var files= evt.target.files;
if (files) {
for (var i=0, f; f=files[i]; i++) {
out.innerHTML += i + ': <b>' + f.name + '</b> (size: ' + f.size + ', Last Modified: ' + f.lastModifiedDate + ')<br>';
}
}
}
function main() {
document.getElementById('id_file_input').addEventListener('change', display_chosen_files, false);
}
</script>
</head>
<body onload="main()">
Choose files: <input type="file" id="id_file_input" multiple>
<p>Chosen files:
<div id="out"></div>
</body>
</html>