FileReader小结

来源:互联网 发布:帝国cms 文件权限 编辑:程序博客网 时间:2024/06/07 06:42

FileReader接口主要用来把文件对象或者Blob对象读入内存,并使用属性方法从文件或Blob中读取数据。它继承自EventTarget。而且还使用了异步机制的API,使用该API可以在浏览器主线程中异步访问文件系统。


1、FileReader支持的属性、事件、方法如下:

[Constructor]interface FileReader: EventTarget {  // async read methods  void readAsArrayBuffer(Blob blob);  void readAsBinaryString(Blob blob);  void readAsText(Blob blob, optional DOMString encoding);  void readAsDataURL(Blob blob);  void abort();  // states  const unsigned short EMPTY = 0;  const unsigned short LOADING = 1;  const unsigned short DONE = 2;  readonly attribute unsigned short readyState;  // File or Blob data  readonly attribute any result;  readonly attribute DOMError error;  // event handler attributes  attribute [TreatNonCallableAsNull] Function? onloadstart;  attribute [TreatNonCallableAsNull] Function? onprogress;  attribute [TreatNonCallableAsNull] Function? onload;  attribute [TreatNonCallableAsNull] Function? onabort;  attribute [TreatNonCallableAsNull] Function? onerror;  attribute [TreatNonCallableAsNull] Function? onloadend;};  
2、事件

onabort          数据读取中断触发

onerror          数据读取出错时触发

onloadstart    数据读取开始时触发

onprogress    数据读取中

onload           数据读取成功完成时触发

onloadend     数据读取完成时触发


3、方法

    方法名                               参数                              描述

readAsBinaryString                file                         将文件读取为二进制代码

readAsArrayBuffer                blob                        将文件读取问ArrayBuffer

readAsText                          file,[encoding]        将文件读取为文本                        //第二个参数为编码方式,默认为utf-8

readAsDataURL                   file                           将文件读取为DataURL                 //该方法事实上以一种特殊格式的URL地址形式直接读入页面(图片,html)

abort                                 none                         中断读取


4、例子

<script type="text/javascript">var result = document.getElementById("result");var file = document.getElementById("file");
//判断是否支持FileReaderif(typeof FileReader=='undefined') {  result.innerHTML = "<p> your browser not support the FileReader </p>"  file.setAttribute('disabled','disabled');  }function readAsBinaryString(){   var file = document.getElementById("file").file[0];   var reader = new FileReader();   reader.readAsBinaryString(file);   reader.onload = function(f)    {         var result = document.getElementById("result");         result.innerHTML = this.result;    }}</script>


原创粉丝点击