40 lines
1.2 KiB
HTML
40 lines
1.2 KiB
HTML
<!DOCTYPE html>
|
||
<html>
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<title>Demo</title>
|
||
|
||
<link href="//unpkg.com/layui@2.9.7/dist/css/layui.css" rel="stylesheet">
|
||
</head>
|
||
<body>
|
||
<div class="layui-upload-drag" style="display: block;margin: 10px;" id="ID-upload-demo-drag">
|
||
<i class="layui-icon layui-icon-upload"></i>
|
||
<div>点击上传,或将文件拖拽到此处,支持xls、xlsx、csv</div>
|
||
<div class="layui-hide" id="ID-upload-demo-preview">
|
||
<hr> <img src="" alt="上传成功后渲染" style="max-width: 100%">
|
||
</div>
|
||
</div>
|
||
|
||
<script src="../../../component/layui/layui.js"></script>
|
||
<script src="../../../component/pear/pear.js"></script>
|
||
<script>
|
||
layui.use(function(){
|
||
var upload = layui.upload;
|
||
var $ = layui.$;
|
||
// 渲染
|
||
upload.render({
|
||
elem: '#ID-upload-demo-drag',
|
||
url: '', // 实际使用时改成您自己的上传接口即可。
|
||
done: function(res){
|
||
layer.msg('上传成功');
|
||
$('#ID-upload-demo-preview').removeClass('layui-hide')
|
||
.find('img').attr('src', res.files.file);
|
||
console.log(res)
|
||
}
|
||
});
|
||
});
|
||
</script>
|
||
|
||
</body>
|
||
</html> |