Lennon280

Lennon280

290飞吻 2017-5-26 加入 来自深圳

(这个人懒得留下签名)

Lennon280 最近的提问

Lennon280 最近的回答

  • 2017-12-28 16:39:7使用 layui upload 和 PHP 实现分段上传文件 + 进度条中回答:

    @__清風徐來 我重新上传一份最新的帖子,也是这个,这个帖子也行,但我怕其他朋友看不见后面的代码。
  • 2017-12-28 16:26:43使用 layui upload 和 PHP 实现分段上传文件 + 进度条中回答:

    @__清風徐來 我做在自己的项目中,你可以参考/layui/lay/modules/upload.js 找到这个, p.prototype.upload 里面的替换u变量
  • 2017-12-28 16:22:41使用 layui upload 和 PHP 实现分段上传文件 + 进度条中回答:

    @野沐沐 @__清風徐來 ./layui/lay/modules/upload.js 找到 p.prototype.upload 这个,修改里面的U变量

     u = function() {
    var t = 0,
    n = 0,
    a = e || o.files || o.chooseFiles || r.files,
    u = function() {
    l.multiple && t + n === o.fileLength && "function" == typeof l.allDone && l.allDone({
    total: o.fileLength,
    successful: t,
    aborted: n
    })
    };

    layui.each(a,
    function(e, a) {

    var start = 0; //文件开始长度
    var end; //文件结束长度
    var index = 0; //第几个切片
    var filesize = a.size; //文件大小
    var filename = a.name; //文件名称
    var bytesPerPiece = 1024 * 1024; // 每个文件切片大小定为1MB .
    //计算文件切片总数
    var totalPieces = Math.ceil(filesize / bytesPerPiece);
    var timer = 0;
    up();
    function up(){
    if(start < filesize) {
    end = start + bytesPerPiece;
    if(end > filesize) {
    end = filesize;
    }

    var chunk = a.slice(start,end);//切割文件
    var sliceIndex= a.name + index;
    var r = new FormData;
    r.append(l.field, chunk, filename);
    r.append('totalPieces', totalPieces); //提交给后台PHP接收 切片总数 (之前在這里处理进度条,发现有问题)
    r.append('index', index); //提交给后台PHP接收 切片第几个

    layui.each(l.data,
    function(e, i) {
    r.append(e, i)
    }),
    i.ajax({
    url: l.url,
    type: l.method,
    data: r,
    contentType: !1,
    processData: !1,
    dataType: "json",
    success: function(i) {
    start = end;
    index++;
    t++,
    timer = setTimeout(function(){
    up();
    }, 1000);
    d(e, i),
    u()
    },
    error: function() {
    n++,
    o.msg("请求上传接口出现异常123"),
    m(e),
    u()
    }
    })

    }else{
    clearTimeout(timer);

    return;
    }
    }


    })
    },
    這i是我修改后的
  • 2017-12-28 16:21:32使用 layui upload 和 PHP 实现分段上传文件 + 进度条中回答:

    @__清風徐來 好的,我发现BUG @贤心,我i上传的 文件切片的部分./layui/lay/modules/upload.js 不见了
  • 2017-12-28 10:19:41使用 layui upload 和 PHP 实现分段上传文件 + 进度条中回答:

    @步尘 我都想转py.哈哈,但我觉得目前还是小菜手,没有真正了解PHP语言。
  • 2017-12-28 10:18:12使用 layui upload 和 PHP 实现分段上传文件 + 进度条中回答:

    @虽远必诛 补充说明里面加了,查看功能。预览加可以,目前还没想到放在什么地方,如果只上传图片的话可以加上,如果是文件压缩包就不好弄。
  • 2017-12-27 16:9:2使用 layui upload 和 PHP 实现分段上传文件 + 进度条中回答:

    @步尘 我想说我是php[思考] ,这个分段上传是参考JS原生的分割上传模仿的
  • 2017-12-26 15:45:18使用 layui upload 和 PHP 实现分段上传文件 + 进度条中回答:

    补充:

    上传控件://多文件列表示例
    是多文件上传,但设置了 multiple: duotu ,duotu 如果为false,只是在选择文件的时候不能多选,true可多选。

    但想要的效果是:
    false 单选,只能上传一个并且上传列表里面只能有一个
    true 多选,上传列表多个,并且不能重复

    修改自定义 上传js代码


    ,choose: function(obj){   
    // layer.close(layer.msg());//关闭上传提示窗口
    var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列
    //读取本地文件
    obj.preview(function(index, file, result){

    var tr = $(['<tr id="upload-'+ index +'" class="'+file.lastModified+'">'
    ,'<td>'+ file.name +'</td>'
    ,'<td>'+ bytesToSize(file.size) +'</td>'
    ,'<td>等待上传</td>'
    ,'<td>'
    ,'<button class="layui-btn layui-btn-mini demo-reload layui-hide">重传</button>'
    ,'<button class="layui-btn layui-btn-mini layui-btn-danger demo-delete">删除</button>'
    ,'</td>'
    ,'</tr>'].join(''));

    //单个重传
    tr.find('.demo-reload').on('click', function(){
    obj.upload(index, file);
    });

    //删除
    tr.find('.demo-delete').on('click', function(){
    delete files[index]; //删除对应的文件
    tr.remove();
    uploadListIns.config.elem.next()[0].value = ''; //清空 input file 值,以免删除后出现同名文件不可选
    });

    /*文件上传判断,多选:文件不能重复,单选:只能选择一个*/
    if(duotu){
    var trUpload = demoListView.find('tr.'+file.lastModified).html(); //判断文件上传是否重复
    if(trUpload){
    layer.msg('该选中文件,列表中已存在', {icon:2 , time: 2000 });
    }else{
    demoListView.append(tr);
    }
    }else{
    demoListView.html(tr);
    }

    });
    }
  • 2017-12-26 12:37:31使用 layui upload 和 PHP 实现分段上传文件 + 进度条中回答:

    可以把"正在上传"提示放在before中
    //多文件列表示例

    layui.use('upload', function(){
    var $ = layui.jquery
    ,upload = layui.upload;


    var load = '';

    //多文件列表示例
    var demoListView = $('#demoList');
    uploadListIns = upload.render({
    elem: '#testList'
    ,url: upurl
    ,accept: 'file'
    ,multiple: duotu
    ,auto: false
    ,bindAction: '#testListAction'
    ,size: 512000
    ,processData: false
    ,contentType: false
    ,before: function(obj) {
    load = top.layer.load(2, {content:'正在上传...',shade: [0.001, '#393D49'],success: function(layero){
    layero.find('.layui-layer-content').css({'padding-left':'40px','width':'100px','padding-top':'5px'});
    layero.css({'border-radius':'0','background':'white','box-shadow':'1px 1px 37px rgb0.value = ''; //清空 input file 值,以免删除后出现同名文件不可选
    });

    demoListView.append(tr);
    });
    }
    ,done: function(res, index, upload){
    // layer.close(layer.msg());//关闭上传提示窗口

    if(res.code == 0){ //上传成功
    console.log(res.progress);
    var tr = demoListView.find('tr#upload-'+ index)
    ,tds = tr.children();
    if(res.progress == '100'){
    top.layer.close(load);//关闭上传提示窗口
    tds.eq(2).html('<span style="color: #5FB878;">上传成功</span>');
    tds.eq(3).html('<a href="'+res.tolink+'" target="_blank" class="layui-btn layui-btn-mini layui-btn-normal">查看</a>');
    }else{
    tds.eq(2).html('<div class="layui-progress layui-progress-big" lay-showpercent="true"><div class="layui-progress-bar" lay-percent="'+res.progress+'%" style=" width: '+res.progress+'%;"><span class="layui-progress-text">'+res.progress+'%</span></div></div>');
    tds.eq(3).html(''); //清空操作
    }


    return delete this.files[index]; //删除文件队列已经上传成功的文件
    }
    this.error(index, upload,res.info);
    }
    ,error: function(index, upload,info){
    // layer.close(layer.msg());//关闭上传提示窗口
    top.layer.close(load);//关闭上传提示窗口
    var tr = demoListView.find('tr#upload-'+ index)
    ,tds = tr.children();
    tds.eq(2).html('<span style="color: #FF5722;">上传失败.'+info+'</span>');
    tds.eq(3).find('.demo-reload').removeClass('layui-hide'); //显示重传
    }
    });


    });
  • 2017-12-26 11:50:29使用 layui upload 和 PHP 实现分段上传文件 + 进度条中回答:

    @Mistyss 非压缩版本的我没试过,你可以下载最新的不是非压缩版本的,modules中的upload.js文件里面的,你直接在线格式化一下,去搜索p.prototype.upload
  • 2017-12-26 11:29:10使用 layui upload 和 PHP 实现分段上传文件 + 进度条中回答:

    @Mistyss layui 都是在官网下的最新版,如果你是说modules中的upload.js文件里面的,你直接在线格式化一下就可以了。
  • 2017-11-16 18:23:29form的验证警示框的弹出位置中回答:

    layui/lay/modules/form.js
    找到里面的 msg()



    通过offset可以调整位置 http://www.layui.com/doc/modules/layer.html#offset 文档有详细介绍

    弄好必须重新加载页面去看,页面可能会存在缓存。