H5 API-File API

JS文件读取 File API

# File API
    <input type="file" name="file" id="file">
    <script>
      document.getElementById('file').addEventListener('change',function(){

        var file=this.files;//读取文件
        # 文件属性
        // file[0].name;文件名字 file[0].size;文件大小 file[0].type;文件类型

        var reader=new FileReader();//new FileReader用来读取文件数据
        # new FileReader常用属性 readAsDataURL读取图片URL readAsText读取文本值
        if(/image/.test(file[0].type)){
          reader.readAsDataURL(file[0]);//reader方法读取图片的url
        }else{
          reader.readAsText(file[0]);//reader方法读取文本值
        }

        # new FileReader常用方法 onload读取成功 onerror读取出错 onprogress读取进程
        reader.onload=function(){var result=reader.result;}//读取成功返回结果集
        reader.onerror=function(){}//读取文件出错
        reader.onprogress=function(){}//加载新数据执行

      },false)
    </script>