layui实现多图片上传并限制上传的图片数量
废话不多说了,直接上代码吧!
//给图片添加删除
functionmouseChange(){
$(document).on("mouseentermouseleave",".file-iteme",function(event){
if(event.type==="mouseenter"){
//鼠标悬浮
$(this).children(".info").fadeIn("fast");
$(this).children(".handle").fadeIn("fast");
}elseif(event.type==="mouseleave"){
//鼠标离开
$(this).children(".info").hide();
$(this).children(".handle").hide();
}
});
}
mouseChange();
//json的length
functiongetJsonLength(jsonData){
varjsonLength=0;
for(variteminjsonData){
jsonLength++;
}
returnjsonLength;
}
//多图片上传
varImgList=$('#uploader-list'),uploadListIns=upload.render({
elem:'#chooseImg',
url:$("#projectUrl").val()+'/img/imgUpload.do',
accept:'images',
acceptMime:'image/jpg,image/png,image/jpeg',
exts:'jpg|png|jpeg',
size:1024,
multiple:true,
auto:true,
choose:function(obj){
varfiles=obj.pushFile();//将每次选择的文件追加到文件队列
varlen=getJsonLength(files);
//读取本地文件
obj.preview(function(index,file,result){
if(parseInt(len)+parseInt(coachPicsArray.length)-count>6){
layer.msg("门店图片不能超过6张");
//遍历
$.each(files,function(_key){
varkey=_key;
varvalue=files[_key];
if(_key==index)
{//删除
deletefiles[_key];
}
});
}else{
varreader=newFileReader();
reader.onload=function(e){
varimage=newImage();
image.onload=function(){
varrealWidth=image.width;
varrealHeight=image.height;
vartr=$([''+
' 以上这篇layui实现多图片上传并限制上传的图片数量就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持毛票票。