FileReader 文件读取

来源:互联网 发布:手机看网站源码 编辑:程序博客网 时间:2024/05/24 06:07

fileReader 读取文件

本文主要就是说一下 H5 fileReader 的使用

fileReader API

readAsBinaryString 读取二进制流
readAsDataURL 读取图片病进行base-64编码
readAsText 读取文本文件

code

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>fileReader</title></head><body>    <input type="file" id="lalala"></body><script type="text/javascript">    document.getElementById("lalala").onchange = function(){        fileReader.readAsDataURL(this.id);    }    var fileReader = new FileReader();    function FileReader() {        this.getFile = function (id) {            var file = document.getElementById(id).files[0];            return file;        }        // 二进制流        this.readAsBinaryString = function (fileId) {            var file = this.getFile(fileId);            var reader = new FileReader();            reader.readAsBinaryString(file);            reader.onload = function (f) {                console.log(this);            }        };        // data url        this.readAsDataURL = function (fileId) {            var file = this.getFile(fileId);            var reader = new FileReader();            reader.readAsDataURL(file);            reader.onload = function (f) {                console.log(this);            }        };        // text        this.readAsText = function (fileId) {            var file = this.getFile(fileId);            var reader = new FileReader();            reader.readAsText(file);            reader.onload = function(f){                console.log(this);            }        };    }</script></html>

个人纯手打,有不当之处请留言,谢谢!

原创粉丝点击