<div
class
=
"layui-upload upload"
>
<button type=
"button"
class
=
"layui-form-label"
id=
"upload"
>上传图片</button>
<input
class
=
"layui-upload-file"
type=
"file"
accept=
""
name=
"file"
>
<div
class
=
"layui-upload-list"
>
<img
class
=
"layui-upload-img"
id=
"demo1"
>
<p id=
"demoText"
></p>
</div>
</div>
<script>
layui.
use
([
'laypage'
,
'layer'
,
'upload'
],
function
() {
var
laypage = layui.laypage
, layer = layui.layer
, upload = layui.upload
var
uploadInst = upload.render({
elem:
'#upload'
, url:
'/upload/'
, before:
function
(obj) {
obj.preview(
function
(index, file, result) {
$(
'#demo1'
).attr(
'src'
, result);
});
}
, done:
function
(res) {
if
(res.code > 0) {
return
layer.msg(
'上传失败'
);
}
}
, error:
function
() {
var
demoText = $(
'#demoText'
);
demoText.html('<span style=
"color: #FF5722;"
>上传失败</span>
<a
class
=
"layui-btn layui-btn-xs demo-reload"
>重试</a>');
demoText.find(
'.demo-reload'
).on(
'click'
,
function
() {
uploadInst.upload();
});
}
});
});
</script>