var uploadInst = upload.render({
elem: '.upload_more'
, method: 'POST'
, url: "{:Url('Upload/layuiImgUpload')}"
, field: 'img'
, data: {
dir: 'donation'
}
, before: function (obj) {
var preview = '#preview' + this.id;
//预读本地文件示例,不支持ie8
obj.preview(function (index, file, result) {
$(preview).attr('src', result); //图片链接(base64)
});
}
, done: function (res) {
//如果上传失败
if (res.code > 0) {
return layer.msg('上传失败');
} else {
var path = res.data;
var name = this.name;
console.log(path);
$('#' + name).val(path);
data[name] = path;
}
//上传成功
}
, error: function () {
var imgText = '#imgText' + this.id;
//演示失败状态,并实现重传
imgText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');
imgText.find('.demo-reload').on('click', function () {
uploadInst.upload();
});
}
});
<div class="layui-form-item">
<label class="layui-form-label" style="margin-top:30px;">
活动Banner
</label>
<div class="layui-upload">
<button type="button" class="layui-btn upload_more" lay-data="{id: '1',name:'banner'}">上传图片</button>
<div class="layui-input-inline input_img_inline">
</div>
<div class="layui-upload-list">
<img class="layui-upload-img" style="border:none;" id="preview1">
<p id="imgText1"></p>
</div>
</div>
<input type="hidden" name="banner" id="banner">
</div>
<div class="layui-form-item">
<label class="layui-form-label" style="margin-top:30px;">
活动Banner
</label>
<div class="layui-upload">
<button type="button" class="layui-btn upload_more" lay-data="{id: '1',name:'banner'}">上传图片</button>
<div class="layui-input-inline input_img_inline">
{if ($detail.banner != '')}
<a href="{$detail.banner}" target="_blank">
<img src="{:SITE_URL}{$detail.banner}" class="icon_view" title="点击查看完整图片"/>
</a>
{/if}
</div>
<div class="layui-upload-list">
<img class="layui-upload-img" style="border:none;" id="preview1">
<p id="imgText1"></p>
</div>
</div>
<input type="hidden" name="banner" id="banner" value="{$detail.banner}">
</div>