选择本地图片后,上传前显示在界面上,实现实时预览
1<form name="form1" id="form1" enctype="multipart/form-data">
2 <input type="submit" value=""/>
3 </form>
js代码片段:
1 $("input[type=file]").change = function(){
2 var uploadFile = this;
3 window.URL = window.URL || window.webkitURL;
4 var files = uploadFile.files,img = new Image();
5 if(window.URL){
6 console.log("files[0]:::"+JSON.stringify(files[0]));
7
8 img.src = window.URL.createObjectURL(files[0]);
9 img.width = 80;
10 img.height = 79;
11 img.onload = function(){
12 window.URL.revokeObjectURL(this.src);
13 }
14 console.log("图片大小imgSize:::"+this.files[0].size+" img对象:::"+img.src);
15 var imgSize = this.files[0].size/1024;
16 if(imgSize > 614){
17 mui.toast("上传图片过大,限制不超过614K");
18 return;
19 }
20 isPic = true;
21 $("#imgList").prepend('<div class="lis"><img src="'+img.src+'" alt="" /></div>');
22
23 }
24 }