JAVA项目中实现图片上传
**前端div**
<div class="layui-form-item">
<label class="layui-form-label">头像</label>
<div class="layui-input-inline">
<div class="layui-upload">
<div class="layui-upload-list" style="">
<img class="layui-upload-img" src="${user.userAvatar}" id="demo1" width="100"
height="100">
<p id="demoText"></p>
</div>
<button type="button" class="layui-btn" id="test1">上传图片</button>
<input type="hidden" name="userAvatar" id="userAvatar" value="${user.userAvatar}">
</div>
</div>
</div>
js文件:
<script>
//上传图片
layui.use('upload', function () {
var $ = layui.jquery,
upload = layui.upload;
var uploadInst = upload.render({
elem: '#test1',
url: '/admin/upload/img',
before: function (obj) {
obj.preview(function (index, file, result) {
$('#demo1').attr('src', result);
});
},
done: function (res) {
$("#userAvatar").attr("value", res.data.src);
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-mini demo-reload">重试</a>');
demoText.