easyUI filebox限定文件大小

最新推荐文章于 2023-02-11 17:08:11 发布

weixin_38168139

最新推荐文章于 2023-02-11 17:08:11 发布

阅读量1.2k

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/zou-rong/p/10124221.html

版权

转载自:https://www.2cto.com/kf/201701/574667.html

侵删

easyui1.5filebox控件中增加文件大小的验证规则

2017-01-07 09:22:00 来源： a307433749的专栏

收藏我要投稿

代码：

 
           $.extend($.fn.validatebox.defaults.rules, { 
          
           // filebox验证文件大小的规则函数 
          
           // 如：validType : ['fileSize[1,"MB"]'] 
          
           fileSize : { 
          
           validator :  
           function 
           (value, array) { 
          
           var 
           size = array[0]; 
          
           var 
           unit = array[1]; 
          
           if 
           (!size || isNaN(size) || size == 0) { 
          
           $.error( 
           '验证文件大小的值不能为 "' 
           + size +  
           '"' 
           ); 
          
           }  
           else 
           if 
           (!unit) { 
          
           $.error( 
           '请指定验证文件大小的单位' 
           ); 
          
           } 
          
           var 
           index = -1; 
          
           var 
           unitArr =  
           new 
           Array( 
           "bytes" 
           ,  
           "kb" 
           ,  
           "mb" 
           ,  
           "gb" 
           ,  
           "tb" 
           ,  
           "pb" 
           ,  
           "eb" 
           ,  
           "zb" 
           ,  
           "yb" 
           ); 
          
           for 
           ( 
           var 
           i = 0; i < unitArr.length; i++) { 
          
           if 
           (unitArr[i] == unit.toLowerCase()) { 
          
           index = i; 
          
           break 
           ; 
          
           } 
          
           } 
          
           if 
           (index == -1) { 
          
           $.error( 
           '请指定正确的验证文件大小的单位：["bytes", "kb", "mb", "gb", "tb", "pb", "eb", "zb", "yb"]' 
           ); 
          
           } 
          
           // 转换为bytes公式 
          
           var 
           formula = 1; 
          
           while 
           (index > 0) { 
          
           formula = formula * 1024; 
          
           index--; 
          
           } 
          
           // this为页面上能看到文件名称的文本框，而非真实的file 
          
           // $(this).next()是file元素 
          
           return 
           $( 
           this 
           ).next().get(0).files[0].size < parseFloat(size) * formula; 
          
           }, 
          
           message :  
           '文件大小必须小于 {0}{1}' 
          
           } 
          
           });

使用方式：

html:

1	`<` `input` `name` `=` `"file"` `class` `=` `"easyui-filebox"` `validType` `=` `"fileSize:[10,'MB']"` `>`

js:

 
           $( 
           '#file' 
           ).filebox({   
          
           required :  
           true 
           ,   
          
           width :  
           '300px' 
           ,   
          
           multiple :  
           true 
           ,   
          
           validType : [ 
           'fileSize[1024,"kb"]' 
           ],   
          
           buttonText :  
           '请选择' 
           ,   
          
           buttonAlign :  
           'right' 
           ,   
          
           prompt :  
           '请选择一个图片类型的文件' 
           ,   
          
           accept : [  
           'image/jpg' 
           ,  
           'image/bmp' 
           ,  
           'image/jpeg' 
           ,  
           'image/gif' 
           ,  
           'image/png' 
           ]   
          
           });