layui文件上传重复问题

最新推荐文章于 2024-09-29 20:00:09 发布

韩淼燃

最新推荐文章于 2024-09-29 20:00:09 发布

阅读量5.7k

点赞数 1

CC 4.0 BY-SA版权

分类专栏：闲聊文章标签： layui文件上传重复问题

本文链接：https://blog.youkuaiyun.com/weixin_36691991/article/details/106059900

闲聊专栏收录该内容

168 篇文章

订阅专栏

本文介绍如何使用layui框架实现PPT文件的上传功能，包括文件选择、预览、上传进度显示及上传成功后的处理。代码示例展示了如何配置upload组件，设置URL，限制文件类型为视频，并监听文件选择、上传进度和上传完成事件。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

upload.render({
            elem: '#add_ppts'
            ,url: localStorage.getItem('url') + '/upload/upload/ppt_upload'
            ,accept: 'video' //视频
            ,choose: function(obj){
                // var files = obj.pushFile();
                var files = this.files = obj.pushFile();
                console.log(files)
                obj.preview(function(index,file,result){
                    pt_name = file.name;
                    var size = parseInt(file.size)/1024;
                    size = size/1024;
                    pt_size = size;
                })
            }
            ,progress: function(e , percent) {
                    console.log("进度：" + percent + '%');
                    element.progress('progressBar',percent  + '%');
            }
            ,done: function(res,index){
                console.log(res)
                $("#fileName").val(res.data);
                var ppt_html = '';
                ppt_html +=
                '<li>'+
                '    <h3 class="ppt_name"><img src="../../../layuiadmin/layui/images/ppt.png" alt=""><a href="">'+ pt_name +'</ a></h3>'+
                '    <p class="ppt_size fl">'+ pt_size +'</p >'+
                '    <div class="fr"><button type="button" class="layui-btn layui-btn-sm" onclick="add_ppt()">重传</button><button type="button" class="layui-btn layui-btn-sm layui-btn-danger" onclick="del_ppt()">删除</button></div>'+
                '</li>';
                $(".ppt_view").append(ppt_html);
                delete this.files[index];
            }
        });

下面代码是关键