FileReader 文件读取

最新推荐文章于 2024-04-26 10:22:03 发布

骑乌龟赛跑

最新推荐文章于 2024-04-26 10:22:03 发布

阅读量1.2k

点赞数 1

分类专栏： javascript 文章标签： fileReader H5 上传图片

本文链接：https://blog.csdn.net/qq_37261367/article/details/77949857

版权

javascript 专栏收录该内容

17 篇文章 0 订阅

订阅专栏

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>

个人纯手打，有不当之处请留言，谢谢！

骑乌龟赛跑

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
FileReader 文件读取

fileReader 读取文件本文主要就是说一下 H5 fileReader 的使用fileReader API readAsBinaryString 读取二进制流 readAsDataURL 读取图片病进行base-64编码 readAsText 读取文本文件code<!DOCTYPE html><htm
复制链接

扫一扫