关于js中的Blob对象类型的详细介绍

var input = document.createElement("input");

input.type = "file";

input.accept = "image/*";

input.multiple = true;

input.style.display = "none";

document.body.appendChild(input);

var fileSelect = document.createElement("a");

fileSelect.href = "#";

fileSelect.appendChild(document.createTextNode("Choose files"));

document.body.appendChild(fileSelect);

var imgList = document.createElement("div");

imgList.innerHTML = "<p>No file Selected!</p>"

document.body.appendChild(imgList);

input.addEventListener("change", function(e) {

var files = this.files;

if(!files.length) {

return;

}

imgList.innerHTML = "";

var list = document.createElement("ul");

imgList.appendChild(list);

for(var i = 0; i < files.length; i++) {

var li = document.createElement("li");

list.appendChild(li);

var img = document.createElement("img");

img.src = window.URL.createObjectURL(files[i]);

img.height = 60;

img.width = 60;

img.onload = function() {

window.URL.revokeObjectURL(this.src);

}

li.appendChild(img);

var info = document.createElement("span");

info.innerHTML = files[i].name + ":" + files[i].size + " bytes";

li.appendChild(info);

}

}, false);

fileSelect.addEventListener("click", function(e) {

input.click();

e.preventDefault();

}, false);