<div class="aui-list-item" id="imgFiles">
<!-- 只接受jpg，gif和png格式 -->
<input name="" type="file" multiple="multiple" accept="image/gif, image/jpg, image/png" onchange="showImg(this,3,9)" />
</div>
<div id="imgContainer" style="margin: 10px;"></div>
// 2.7 图片文件上传（imgFiles）
function showImg(obj,minFileNum,maxFileNum) {
imgFiles = obj.files
if (window.File && window.FileList){
var fileCount = obj.files.length;
if (fileCount < minFileNum || fileCount > maxFileNum){
layer.msg('文件个数不符，请重新上传', {time: 1500});
return false;
}
}else{
layer.msg('你的浏览器不支持上传文件,请升级你的浏览器');
return false;
}
getImgsByFileReader(document.getElementById("imgContainer"), imgFiles)
}
// 使用FileReader读取file实例并显示图片
function getImgsByFileReader(el, files) {
$(el).html("");
for (var i = 0; i < files.length; i++) {
let img = document.createElement('img')
img.setAttribute('style', ' 40px; height: 40px; vertical-align: middle; margin-right: 5px;')
el.appendChild(img)
var reader = new FileReader()
reader.onload = function(e) {
img.src = e.target.result
}
reader.readAsDataURL(files[i])
}
}