<li id="li1"><input type="file" style="opacity: 0;width: 100%;height: 4rem;" οnchange="preview(this,'li1')" multiple="multiple" accept="image/x-png, image/jpg, image/jpeg, image/gif" name="images[]"/></li>
//图片上传 var msg = "您可以上传png, jpg, 或者gif格式的图片"; var filter = { "jpeg": "/9j/4", "gif": "R0lGOD", "png": "iVBORw" }; function preview(file,liid) { if (window.FileReader) { for (var index=0, f; f = file.files[index]; index++) { var filereader = new FileReader(); filereader.onload = function (event) { var srcpath = event.target.result; if (!validateImg(srcpath)) { console.log("H5"+msg); } else { showPreviewImage(srcpath,liid); } }; filereader.readAsDataURL(f); } } else { if (!/\.jpg$|\.png$|\.gif$/i.test(file.value)) { console.log("原生"+msg); } else { showPreviewImage(file.value); } } } function validateImg(data) { var pos = data.indexOf(",") + 1; for (var e in filter) { if (data.indexOf(filter[e]) === pos) { return e; } } return null; } function showPreviewImage(src,li) { var img = document.createElement('img'); var add = document.getElementById(li); img.src = src; img.style = "width:64px;height:auto;"; add.style.backgroundImage="url("+src+")"; add.style.backgroudSize='auto auto'; add.style.backgroudRepeat='on-repeat'; }