<script type="text/javascript">
function handleFiles(files){
document.getElementById('text').innerHTML='';
document.getElementById('image').innerHTML='';
for(var i=0;i<files.length;i++){
var f = files[i];
if(f.type.indexOf('text')==0){
var reader = new FileReader();
reader.onload = function(evt) {
var ta = document.createElement('textarea');
ta.cols = 100;
ta.rows = 4;
ta.style.display='block';
ta.value = evt.target.result;
document.getElementById('text').appendChild(ta);
};
reader.readAsText(f, 'UTF-8');
}else if(f.type.indexOf('image')==0){
var img = document.createElement('img');
img.src = f.getAsDataURL();
img.style.width='300px';
document.getElementById('image').appendChild(img);
}
}
}
</script>

<form method="post">
<input type="file" id="input" multiple="true" onchange="handleFiles(this.files)" />
</form>
<div id="text"></div>
<div id="image"></div>