簡介

上傳文件前端可以校驗文件大小，也可以后端校驗文件大小，前端校驗避免了上傳完文件之后對文件大小的校驗，占用服務器資源，大文件上傳時間過長等問題。

實現easyui文件大小校驗自定義擴展

$.extend($.fn.validatebox.defaults.rules, {// filebox驗證文件大小的規則函數// 如：validType : ['fileSize[1,"MB"]']fileSize : {validator : function(value, array) {var size = array[0];var unit = array[1];//var unit = "MB";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--;}console.log(formula);// this為頁面上能看到文件名稱的文本框，而非真實的file// $(this).next()是file元素return $(this).next().get(0).files[0].size < parseFloat(size) * formula;},//message : '文件大小必須小于 {0} MB'message : '文件大小必須小于 {0}{1}'} });

具體用法

<input class="easyui-filebox" id="uploadFile" name="file" data-options="prompt:'請選擇文件',buttonText:'選擇文件',validType:['fileSize[100,\'MB\']']" style="width:300px">

效果

說明

拓展插件是轉自一位大神的，具體忘記是哪個網址了

總結

以上是生活随笔為你收集整理的easyui filebox文件大小校验的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。