码迷,mamicode.com
首页 > 其他好文 > 详细

文件读取

时间:2020-03-08 13:53:13      阅读:56      评论:0      收藏:0      [点我收藏+]

标签:mit   star   gre   文件读取   结果   function   doc   htm   var   

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
     <form action="">
     文件:<input name="myFile" id="myFile" type="file" onchange="getFileContent(); multiple" ><br>
     <input type="submit">
     </form>
     <img src="" alt="">
     <script>
     function getFileContent(){
         var reader=new FileReader();
         var file=document.querySelector("#myFile").files;
         reader.readAsDataURL(file[0]);
        //  console.log(reader.result);//读取结束后会把读取的结果存放在result中
        //  console.log(123);
        reader.onloadend=function(){
        document.querySelector("img").src=reader.result;    
        }

     }
     </script>
</body>
</html>

<!-- 
    1.FileReader() :读取文件内容
      0.onbort:读取文件短片时触发
      1.onerror:读取错误时触发
      2.onload:文件读取完成时触发
      3.onloadend:读取完成触发无论失败还是成功
      4.onloadstart:开始读取时触发
      5.onprogress:读取过程中持续触发
    2.readAsText():读取文本内容
    3.readAsDataURL():读取文件获取一段data开头的字符串,这段字符串本质就是dataURL.dataURL是一种将文件嵌入到文档的方案;
    4.readAsBinaryString():读取任意类型的文件,返回二进制字符串
    5.abort();中断截取
    6.onChange="";返回实时的信息
 -->

 

文件读取

标签:mit   star   gre   文件读取   结果   function   doc   htm   var   

原文地址:https://www.cnblogs.com/wxy0715/p/12442099.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!