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];
        },

js上传限制文件大小

推荐阅读