• js上传限制文件大小


    在上传文件过程中需要限制文件的大小,我们可以通过file对象的size属性来判断;

    思路很简单,麻烦的地方可能是文件大小的计算;

    我们需要做的是在共用函数中定义这样的方法:

    /* 限制文件大小,返回 boolean
             * file:文件对象
             * limiteSize:限制大小---例如:"50MB"
             * */
            limitFileSize: function (file, limitSize) {
                var arr = ["KB", "MB", "GB"]
                var limit = limitSize.toUpperCase();
                var limitNum = 0;
                for (var i = 0; i < arr.length; i++) {
                    var leval = limit.indexOf(arr[i]);
                    if (leval > -1) {
                        limitNum = parseInt(limit.substr(0, leval)) * Math.pow(1024, (i + 1))
                        break
                    }
                }
                if (file.size > limitNum) {
                    return false
                }
                return true
            },

    然后在需要上传之前调用对file对象校验即可

    tools.limitFileSize(file,'50MB')

    关于file对象的获取:

      如果使用自定义的input标签,在dom元素的files属性中获取;

      如果使用第三方的上传组件,一般在上传前的钩子函数的参数中;

      如果需要告诉用户此次上传文件的大小,你可以定义这样的函数,相当于上诉函数的逆运算:

            /*
            * 格式化文件大小显示
            * value : file文件的大小值
            * */
            formateSize:function(value){
                if (null == value || value == '') {
                    return "0 Bytes";
                }
                var unitArr = new Array("Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB");
                var index = 0;
                var srcsize = parseFloat(value);
                index = Math.floor(Math.log(srcsize) / Math.log(1024));
                var size = srcsize / Math.pow(1024, index);
                size = size.toFixed(2);//保留的小数位数
                return size + unitArr[index];
            },
  • 相关阅读:
    ppt 制作圆角三角形
    ROS 错误之 [rospack] Error: package 'beginner_tutorials' not found
    ubuntu下安装搜狗输入法以及出现不能输入中文的解决办法
    <crtdbg.h> 的作用
    mybatis配置
    POJO、Bean和JavaBean
    类类型与反射
    Spring层面的事务管理
    java项目常用架构
    java 遍历数组的几种方式
  • 原文地址:https://www.cnblogs.com/wuhaozhou/p/6929774.html
Copyright © 2020-2023  润新知