选择本地图片后,上传前显示在界面上,实现实时预览

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 }

转载于:https://www.cnblogs.com/grnBlogs/p/5394594.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值