处理用户文件 读取文件属性 在实际应用程序中,文件名、文件大小及文件类型等信息都是必需 的,这些信息可以让用户了解所处理文件的情况,甚至可以控制用 户的输入。< input>标签发送的文件对象提供了可以用来获得文件信 息的多个属性,具体属性如下所示。 name:该属性返回文件的全名(文件名和扩展名)。 size:该属性返回文件的大小,以字节为单位。 type:该属性返回文件的类型,以MM类型表示
处理用户文件 读取文件属性 在实际应用程序中,文件名、文件大小及文件类型等信息都是必需 的,这些信息可以让用户了解所处理文件的情况,甚至可以控制用 户的输入。<input>标签发送的文件对象提供了可以用来获得文件信 息的多个属性,具体属性如下所示。 name:该属性返回文件的全名(文件名和扩展名)。 size:该属性返回文件的大小,以字节为单位。 type:该属性返回文件的类型,以MIME类型表示
处理用户文件 读取文件属性 案例2 function initiate[ databordocument getElementById( databor') var myfiles=document. getElementById(myfiles) myfiles addEventListener( change, process, false) function process(e)t fil databox. innerS’; var filesfiles[o] if(ifile type match(image. */1))t alert(请插入一个图片) databox, inner+文件名:+e.,nane+<br dateboz. innerHn+大小:+11e.aize+ bytes<br reader. readAsDataURL(file)
处理用户文件 读取文件属性 案例2: function initiate(){ databox=document.getElementById('databox'); var myfiles=document.getElementById('myfiles'); myfiles.addEventListener('change',process,false); } function process(e){ var files=e.target.files; databox.innerHTML=''; var file=files[0]; if(!file.type.match(/image.*/i)){ alert('请插入一个图片'); } else{ databox.innerHTML+='文件名:'+file.name+'<br>'; databox.innerHTML+='大小:'+file.size+' bytes<br>'; var reader=new FileReader(); reader.onload=show; reader.readAsDataURL(file); }
处理用户文件 文件分割 除了文件外,AP还能处理另一个源类型,即bob。b1ob是代表原始 数据的对象。创建blob对象的目的是为了克服 JavaScript在处理二 进制数据上的限制。blob通常是由文件生成的,但并不是必需的, 不将整个文件加载到内存就能处理数据是个很好的做法,这种做法 为一小片一小片地处理二进制信息提供了可能性。 Blob有多个作用,但主要是为了提供更好的方法处理原始数据或大 型文件的小片段。要用以前的blob或文件生成blob,API提供了 slice)方法。 ■ Slice( start, length,type):该方法返回一个b1ob或文件生成 新的bob。第一个属性代表起点,第二属性指定新的blob长度,最 后一个属性是一个可选参数,指定数据的类型
处理用户文件 文件分割 除了文件外,API还能处理另一个源类型,即blob。blob是代表原始 数据的对象。创建blob对象的目的是为了克服JavaScript在处理二 进制数据上的限制。blob通常是由文件生成的,但并不是必需的, 不将整个文件加载到内存就能处理数据是个很好的做法,这种做法 为一小片一小片地处理二进制信息提供了可能性。 Blob有多个作用,但主要是为了提供更好的方法处理原始数据或大 型文件的小片段。要用以前的blob或文件生成blob,API提供了 slice()方法。 Slice(start,length,type):该方法返回一个blob或文件生成 新的blob。第一个属性代表起点,第二属性指定新的blob长度,最 后一个属性是一个可选参数,指定数据的类型
处理用户文件 文件分割 案例3 function process(e) var files=etarget files; databox innerHTML=". var file=files[o]: var reader=new File Reader reader. onload=function(e f show(e, file), 1 var blob=file. slice(0, 1000) reader readS DataURL(blob)
处理用户文件 文件分割 案例3: function process(e){ var files=e.target.files; databox.innerHTML=''; var file=files[0]; var reader=new FileReader(); reader.onload=function(e){ show(e, file);}; var blob=file.slice(0,1000); reader.readAsDataURL(blob); }