FileReader小结

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");

//判断是否支持FileReader
if(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>