jQuery多图上传
HTML代码部分
<label class="col-sm-3 control-label">图片:</label> <div class="col-sm-9"> <input type="file" name="file[]" class="form-control" multiple accept="image/*" onchange="onchageUp(this)" required> </div> <div class="" style="margin-left:175px;margin-top:45px;"> <div class="box" style="display: flex;justify-content: space-between;">
</div> </div>
js代码部分
var len = 0; function onchageUp(ev) { var url = ev.files; len += ev.files.length; if(len>5){ alert('不能超过五张图片'); ev.outerHTML = ev.outerHTML//重新加载 }else { $.each(url, function(i){ var path = window.URL.createObjectURL(url[i]); $('.box').append("<div><img src='"+ path +"'> </div>"); }); } }
后台用form表单提交