js实现前端学习用户晒图(图片上传预览)

通过js语句动态创建img元素，元素具体属性根据情况而定，主要代码如下：

//上传图片并预览

var input = document.getElementById("file_input");

var imageType = /image.*/;

var getOnloadFunc = function(aImg) {

return function(evt) {

aImg.src = evt.target.result;

};

}

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

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

var file = this.files[i];

if (!file.type.match(imageType)) {

continue;

}

 

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

img.style.;

img.style.;

img.style.marginLeft="10px";

img.id="upload-img-show";

var _img=document.getElementById("assess-form");

_img.appendChild(img);

img.onclick=function(){

if (confirm("删除照片？")) {

img.style.display="none";

}

else {

return false;

};

// img.style.display="none";

}

var reader = new FileReader();

reader.onload = getOnloadFunc(img);

reader.readAsDataURL(file);

}

}, false);