利用FileReader實現多圖片上傳瀏覽重點記錄
阿新 • • 發佈:2019-02-10
FileReader用Base64對檔案流進行編碼
var files = document.getElementById("file").files;
if (files.length < 5) {
for (var i = 0; i < files.length; i++) {
/**
* 隱藏img控制元件
*/
var reader = new FileReader();
reader.readAsDataURL(files[i]);
var ui =document.getElementById("img_identityA");
ui.style.display="none";
reader.onload = function(e) {
//新增 img
var img = document.createElement("img");
//設定 img 屬性,如 id
img.setAttribute("id", "newImg");
img.setAttribute("width", "150");
img.setAttribute("height", "150");
//設定 img 圖片地址
img.src = this.result;
var div1=document.getElementById('picture');
div1.appendChild(img);
};
}
限制圖片大小
- var fileSize = Math.round(file.size / 1024 / 1024);
- if(fileSize >= 3) {
- alert("請上傳小於少於3M的圖片");
- return;
- }