H5文件操作api--持续完善中
2016-12-12 15:20
218 查看
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"); } }
相关文章推荐
- H5文件操作API
- H5基础(4)-HTML5文件操作API
- VC++编程中的文件操作API和CFile类
- 解读VC++程序开发中的文件操作API和CFile类
- Windows文件操作API
- 解读VC++编程中的文件操作API和CFile类中CreateFile方法
- 新 API 寻求让 JavaScript 操作本地文件
- 文件操作 API 函数介绍
- WinCE下可用的三种不同的文件操作API
- Windows文件操作API及部分例子(vb)
- 解读VC++编程中的文件操作API和CFile类【转】
- PDF文件操作API之PDFBox<一> PDFBox入门
- 文件操作API和CFile类
- 解读VC++编程中的文件操作API和CFile类
- 文件操作 API 函数介绍
- Windows文件操作的API(CreateFile系列)
- 文件操作 API 函数介绍
- 文件操作 API 函数介绍
- 解读VC++编程中的文件操作API和CFile类
- VC下:文件操作的一些API