zoukankan      html  css  js  c++  java
  • plupload如何限制上传文件数量,限制只能上传单个文件

    1 完整代码

    $(function() {
    $("#uploader").pluploadQueue({
    runtimes : 'html5,gears,flash,silverlight,browserplus,html4',//设置运行环境,会按设置的顺序,可以选择的值有html5,gears,flash,silverlight,browserplus,html4
    flash_swf_url : '${pageContext.request.contextPath}/jslib/plupload_1_5_7/plupload/js/plupload.flash.swf',// Flash环境路径设置
    silverlight_xap_url : '${pageContext.request.contextPath}/jslib/plupload_1_5_7/plupload/js/plupload.silverlight.xap',//silverlight环境路径设置
    url : '${pageContext.request.contextPath}/UploadServlet',//上传文件路径
    max_file_size : '5mb',//100b, 10kb, 10mb, 1gb
    chunk_size : '100mb',//分块大小,小于这个大小的不分块
    unique_names : true,//生成唯一文件名
    multi_selection: false,
    //multiple_queues : true,//是否可以多次上传
    // 如果可能的话,压缩图片大小
    // resize : { width : 320, height : 240, quality : 90 },
    // 指定要浏览的文件类型
    filters : [ {
    title : 'Image files',
    extensions : 'jpg,gif,png'
    }
    /* , {
    title : 'Zip files',
    extensions : 'zip,7z,rar'
    } */
    , {
    title : 'Office files',
    extensions : 'doc,docx,excel,ppt,txt,mpp,xls,xlsx,pdf'
    }
    /* , {
    title : 'exe files',
    extensions : 'exe,bit,bat'
    } */
    ],
    init : {
    BeforeUpload:function(up,file){
    /* $.post('${pageContext.request.contextPath}/docinf/docinfDoc/checkDocIsExist.do',
    {name:file.name}, function(json) {
    if (json.success) {
    ;
    } else {
    $.messager.show('提示', json.msg, 'info');
    }
    },"JSON"); */

    },
    FileUploaded : function(up, file, info) {//文件上传完毕触发
    var response = $.parseJSON(info.response);
    if (response.status) {
    $("#isUploadFile").attr("value",true);//给隐藏域 赋值 表示 有上传文件
    $('#form').append('<input type="hidden" name="urlfileName" value="'+file.id+'"/>');
    $('#form').append('<input type="hidden" name="fileUrl" value="'+response.fileUrl+'"/>');
    $('#form').append('<input type="hidden" name="fileName" value="'+file.name+'"/><br/>');
    }
    },

    FilesAdded : function(uploader, file){
    if(file[0].name.length>25) {
    $.messager.show('提示',"文件名称太长!", 'info');
    return;
    }
    if(uploader.files.length>1) { // 最多上传3张图
    $.messager.show('提示',"只能上传一个文件,请删除多余文件!", 'info');
    return;
    }

    uploader.start();
    }
    }
    });

    // 客户端表单验证
    $('#form').submit(function(e) {
    var uploader = $('#uploader').pluploadQueue();
    if (uploader.files.length > 0) {// 判断队列中是否有文件需要上传
    uploader.bind('StateChanged', function() {// 在所有的文件上传完毕时,提交表单
    if (uploader.files.length === (uploader.total.uploaded + uploader.total.failed)) {
    $('form')[0].submit();
    }
    });
    uploader.start();
    } else {
    //alert('请选择至少一个文件进行上传!');
    $.messager.show('提示', '请选择至少一个文件进行上传!', 'error');
    }
    return false;
    });

    });

    2 关键代码

    FilesAdded : function(uploader, file){
    if(file[0].name.length>25) {
    $.messager.show('提示',"文件名称太长!", 'info');
    return;
    }
    if(uploader.files.length>1) { // 最多上传1个文件
    $.messager.show('提示',"只能上传一个文件,请删除多余文件!", 'info');
    return;
    }

    uploader.start();
    }

  • 相关阅读:
    原生ES-Module在浏览器中的尝试
    常见的web攻击总结
    node第三方模块----nodemailer发送邮件
    08----mockjs处理前端传来的路径,获取?后面的值
    07----mockjs获取前端传递的数据
    05-----Mock.Random 扩展方法
    03----Mock.mock() 生成接口,随机数据
    06----Mock.setup()
    十一. for of
    十.数组解构
  • 原文地址:https://www.cnblogs.com/Alex80/p/11435299.html
Copyright © 2011-2022 走看看