js 判斷上傳文件大小及格式代碼
我們在做文件上傳時,為了實現(xiàn)異步上傳的效果,一般會選擇采用iframe的形式來進行文件的上傳,但我們不能像ajax那樣對服務端返回的數(shù)據(jù)進行處理,從而來進行文件大小以及文件樣式的判斷,所以我們一般也會想到使用js對上傳的文件大小以及格式進行初步的判斷,在服務端再進行一次判斷(防止瀏覽器拒絕執(zhí)行腳本文件)。
以下提供一種方法用js判斷文件大小。
var url = window.location.href, type = url.substr(url.lastIndexOf('/')+1); // console.log(type); var allowType = { ".bmp":1, ".png":1, ".jpeg":1, ".jpg":1, ".gif":1, ".mp3":2, ".wma":2, ".wav":2, ".amr":2, ".rm":3, ".rmvb":3, ".wmv":3, ".avi":3, ".mpg":3, ".mpeg":3, ".mp4":3 }; var allowSize = {1:2097152, 2:5242880, 3:20971520}; var errMsg = { "0" : '圖片格式不正確<br/>' + '音頻格式不正確<br/>' + '視頻格式不正確<br/>', "1" : ‘圖片格式不正確', "2" : '音頻格式不正確', "3" : '視頻格式不正確' }; var errSizeMsg = { '1':'圖片文件小于2M', '2':'音頻文件小于5M', '3':'視頻文件小于20M', } function checkFileType(filename, type){ var ext = filename.substr(filename.lastIndexOf(".")).toLowerCase(), res = allowType[ext]; if (type == 0) { return !!res; } else { return type == res; } } function checkFileSize(target, size){ var isIE = /msie/i.test(navigator.userAgent) && !window.opera; var fileSize = 0; if (isIE && !target.files) { var filePath = target.value; var fileSystem = new ActiveXObject("Scripting.FileSystemObject"); var file = fileSystem.GetFile (filePath); fileSize = file.Size; } else { fileSize = target.files[0].size; } // var fsize = fileSize / 1024*1024; if(parseInt(fsize) >= parseInt(size)){ return false; }else{ return true; } } function upload(obj){ var filename = jQuery.trim(jQuery('#uploadFile').val()); if (!filename || filename == ""){ // 提交前的再次檢測 alert('選擇需要上傳的文件'); return false; } if (!checkFileType(filename, type)){ alert('文件格式不正確'); return false; } var ext = filename.substr(filename.lastIndexOf(".")).toLowerCase(); var res = allowType[ext]; if(!checkFileSize(obj,allowSize[res])){ alert(errSizeMsg[res]); return false; } //其他處理 } //uploadFile為上傳控件的id,obj為上傳控件的本身(this)
最新發(fā)現(xiàn)的一段代碼也比較不錯
js 上傳之后去除onclick 事件 判斷上傳格式
移除 onclick事件 $("#enclosure").removeAttr("onclick"); function changeImg() { debugger; var file = document.getElementById("file"); var img = file.files[0]; file.value = ''; if (img) { // var base64 = blobToDataURL(img, function(base64Url) { // enclosure.text = base64Url; // }) var type = img.name.substr((img.name.lastIndexOf(".") + 1));//文件后綴 console.log(pdtype(type)); if (pdtype(type) == -1) { alert('文件格式錯誤請重新上傳!'); return; } blobToDataURL(img); } // Xrm.Utility.showProgressIndicator("處理中") } //上傳多格式判斷 function pdtype(ext) { return ['png', 'pdf', 'jpg', 'doc', 'docx', 'xls', 'xlsx'].indexOf(ext.toLowerCase()); }
到此這篇關于js 判斷上傳文件大小及格式代碼的文章就介紹到這了,更多相關判斷上傳文件大小內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
相關文章
《javascript設計模式》學習筆記五:Javascript面向對象程序設計工廠模式實例分析
這篇文章主要介紹了Javascript面向對象程序設計工廠模式,結合實例形式分析了《javascript設計模式》中Javascript面向對象工廠模式相關概念、原理、用法及操作注意事項,需要的朋友可以參考下2020-04-04淺談javascript控制HTML5的全屏操控,瀏覽器兼容的問題
下面小編就為大家?guī)硪黄獪\談javascript控制HTML5的全屏操控,瀏覽器兼容的問題。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-10-10js實現(xiàn)適用于素材網(wǎng)站的黑色多級菜單導航條效果
這篇文章主要介紹了js實現(xiàn)適用于素材網(wǎng)站的黑色多級菜單導航條效果,涉及javascript鼠標事件及頁面元素樣式的動態(tài)切換技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-08-08javascript使用數(shù)組的push方法完成快速排序
排序的方法有很多,本節(jié)為大家介紹的是使用數(shù)組的push方法完成快速排序,當然你也可以舉一反三2014-09-09詳解js如何優(yōu)雅處理后端返回的單元格數(shù)據(jù)
這篇文章主要為大家詳細介紹了JavaScript如何優(yōu)雅處理后端返回的單元格數(shù)據(jù),文中的示例代碼講解詳細,有需要的小伙伴可以跟隨小編一起學習一下2023-10-10