layui 單個圖片上傳
<div class="layui-form-item">
<label class="layui-form-label">LOGO圖片:</label>
<div class="layui-upload">
<div class="layui-upload-list">
<img class="layui-upload-img" id="upimg">
</div>
<button type="button" class="layui-btn" id="upbtn">更新上傳</button>
<input type="hidden" value="1" name="logo"/>
</div>
</div>
//若是出現不可上傳同一圖片問題 則需要清理file的value
var uploadInst = upload.render({
elem: '#upbtn'
,url: '<?php echo Url::to(['/admin/upload/img']); ?>&type=1'
,field:'UploadForm[file]'
,acceptMime: 'image/jpg, image/png, image/jpeg'
,exts:'jpg|png|jpeg'
,before: function(obj){
layer.load(1, {
shade: [0.5,'#000']
});
//預讀本地檔案示例,不支援ie8
obj.preview(function(index, file, result){
$('#upimg').attr('src', result); //圖片連結
});
}
,done: function(res){
//如果上傳失敗
if(res.code > 0){
return layer.msg('上傳失敗');
}else{ //上傳成功
$("input[name='logo']").val(res.msg);
layer.msg("上傳成功");
}
layer.closeAll();
}
,error: function(){
//演示失敗狀態,並實現重傳
layer.closeAll();
layer.msg("上傳失敗");
}
});