JS 上傳圖片轉換成二進制流base64


accept可限制上傳所選文件是什么類型

<input type="file" style='display: none;' id="image_upload" accept="image/jpeg, image/png, image/jpg" >
 1    var fileInput = document.getElementById("image_upload");  2     //選擇文件
 3     fileInput.addEventListener('change',function(){  4         //如果未傳入文件則中斷
 5         if(fileInput.files[0] == undefined){  6             return;  7  }  8         
 9         var file = fileInput.files[0]; 10         
11         //FileReader可直接將上傳文件轉化為二進制流
12         var reader = new FileReader(); 13         reader.readAsDataURL(file);//轉化二進制流,異步方法
14         reader.onload = function(){//完成后this.result為二進制流
15             console.log(this.result); 16             
17             //頁面顯示文件名
18             $("#name").html(file.name); 19             
20             var base64Str = this.result; 21             var startNum = base64Str.indexOf("base64,"); 22             startNum = startNum*1 + 7; 23             //去除前部格式信息(如果有需求)
24             var baseStr = base64Str.slice(startNum); 25             
26             //臨時存儲二進制流
27             $("#tempName").val(baseStr); 
28

29     }
30   })

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM