<div class="layui-form-item">
<label class="layui-form-label">图片</label>
<div class="layui-input-block">
<button type="button" class="layui-btn" id="uploadImage">
<i class="layui-icon"></i>选择图片
</button>
<button type="button" class="layui-btn" id="submit_image">开始上传</button>
<!-- <div class="layui-upload-list" id="imageView">-->
<blockquote class="layui-elem-quote layui-quote-nm"
style="margin-top: 10px;width: 600px;">
预览图:
<div class="layui-upload-list" id="imageView"></div>
</blockquote>
<input id="imageText" name="imagesUrl" type="hidden" />
</div>
</div>
//上传图片
var fileCount = 0;//控制文件数量
var maxFileCount = 10;//文件上传最大数量,如果没有限制上传文件的数量则不需要
var maxFileSize = 100;//文件上传最大大小
var resultValue = 0;
var url = "";
upload.render({
elem: '#uploadImage',
url: '/management/insertImage',
auto: false,
//multiple: true,
choose: function(obj){
var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列
//layer.load();
console.log(obj)
//预读本地文件示例,不支持ie8
obj.preview(function(index, file, result){
fileCount++;
if(fileCount>maxFileCount){
fileCount = maxFileCount;
layer.msg('文件数量不得超过'+maxFileCount+'个',{icon:2});
return;
}
//在当前ID为“imageView”的区域显示图片
$('#imageView').append('<img name = "edImage" ' +
'style="width: 150px; margin-left: 8px;" ' +
'src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img">')
console.log(result)
//点击图片进行放大
$(document).on('click', '.layui-upload-img', function(data){
var imgSrc=$(this).attr('src');
layer.open({
type:1
,title:false
,closeBtn:0
,skin:'layui-layer-nobg'
,shadeClose:true
,content:'<img style="width:100%;height:100%;" class="layui-upload-img" src="'+ imgSrc +'"/>'
,scrollbar:false
})
})
});
},
bindAction: '#submit_image',
done: function(res){
if(resultValue < fileCount){
url = url + res.url + ",";
}
$("#imageText").attr('value',url);
// if(resultValue == 1){
// $("#imageText").attr('value',url);
// }
resultValue++;
console.log(res)
return layer.msg(res.message,{icon: res.code,time: 2000});
}
});