116JS-文件读取显示预览图片FileReader=121

文件读取 FileReader

var reader = new FileReader();
//异步方法
 reader.readAsDataURL('文件');
 reader.onload = function () {
     console.log(reader.result); 
 }

实例

// 选择文件上传控件
    var file = document.querySelector('#file');
    var preview =document.querySelector('#preview');
    // 当用户选择完文件以后
    file.onchange = function () {
        // 创建文件读取对象
        var reader = new FileReader();
        // 代表用户选择的文件列表
        // console.log(this.files[0]);

        // 读取文件
        reader.readAsDataURL(this.files[0]);
        // 监听onload事件
        reader.onload = function () {
            // console.log(reader.result);
            preview.src=reader.result;
        }

    }