H5之FileReader的使用

var result=document.getElementById("result");

var file=document.getElementById("file");

//判断浏览器是否支持FileReader接口

if(typeof FileReader == 'undefined'){

   result.InnerHTML="

你的浏览器不支持FileReader接口！

";

   //使选择控件不可操作

   file.setAttribute("disabled","disabled");

}

function readAsDataURL(){

   //检验是否为图像文件

   var file = document.getElementById("file").files[0];

   if(!/image\/\w+/.test(file.type)){

       alert("看清楚，这个需要图片！");

       return false;

   }

   var reader = new FileReader();

   //将文件以Data URL形式读入页面

   reader.readAsDataURL(file);

   reader.onload=function(e){

       var result=document.getElementById("result");

       //显示文件

       result.innerHTML='图片路径';

   }

}

function readAsBinaryString(){

   var file = document.getElementById("file").files[0];

   var reader = new FileReader();

   //将文件以二进制形式读入页面

   reader.readAsBinaryString(file);

   reader.onload=function(f){

       var result=document.getElementById("result");

       //显示文件

       result.innerHTML=this.result;

   }

}

function readAsText(){

   var file = document.getElementById("file").files[0];

   var reader = new FileReader();

   //将文件以文本形式读入页面

   reader.readAsText(file);

   reader.onload=function(f){

       var result=document.getElementById("result");

       //显示文件

       result.innerHTML=this.result;

   }

}

   请选择一个文件：