H5文件操作api--持续完善中

Drop Here

<input type="file" onchange="upload(this)" /></p>
<div id="dropbox" style="height: 100px; width: 100px; border: 1px solid black;">Drop Here</div>
<div id="filecontent"></div>

function upload(myfile) {
var file = myfile.files[0];
 if (window.FileReader) {
 var fr = new FileReader();
 fr.readAsText(file, "gb2312");
 fr.onload = function (e) {
 document.getElementById("filecontent").innerHTML = this.result;
  }
 }
 else {
 alert("Not supported by your browser!");
 }
} 

var dropbox = document.getElementById("dropbox");
dropbox.addEventListener("dragenter", dragenter, false);
dropbox.addEventListener("dragover", dragover, false);
dropbox.addEventListener("drop", drop, false);
function dragenter(e) {
 e.stopPropagation();
 e.preventDefault();
}
function dragover(e) {
 e.stopPropagation();
 e.preventDefault();
}
function drop(e) {
 e.stopPropagation();
 e.preventDefault();
var dt = e.dataTransfer;
var files = dt.files;
if (files.length) {
 var file = files[0];
 var fr = new FileReader();
 fr.onload = function () {
 document.getElementById("filecontent").innerHTML = this.result;
  };
 fr.readAsText(file, "gb2312");
 }
}