<!DOCTYPE HTML>
<html>
<body>
<button type="button" id="open">Choose</button>
<input type="file" name="file" id="file" style="display:none" multiple/>
<output id="list"></output>
<script>
if (window.File && window.FileReader && window.FileList && window.Blob) {
document.getElementById('open').addEventListener('click',function() {
document.getElementById('file').click();
}, false);
document.getElementById('file').addEventListener('change',
function handleFileSelect(event) {
for (var i=0, output=[]; i<event.target.files.length; i++) {
var f = event.target.files[i];
output.push(
'<li><strong>',
escape(f.name),
'</strong> (', f.type || 'n/a', ') - ',
f.size, ' bytes, last modified: ',
f.lastModifiedDate.toLocaleDateString(), '</li>');
}
document.getElementById('list').innerHTML = '<ul>' + output.join('') + '</ul>';
}, false);
} else {
alert('The File APIs are not fully supported in this browser.');
}
</script>
</body>
</html>
