首頁 > web前端 > js教程 > 主體

js 判斷上傳檔案大小及格式程式碼_javascript技巧

WBOY
發布: 2016-05-16 17:15:39
原創
948 人瀏覽過

我們在做文件上傳時,為了實現非同步上傳的效果,一般會選擇採用iframe的形式來進行文件的上傳,但我們不能像ajax那樣對服務端返回的資料進行處理,從而來進行文件大小以及文件樣式的判斷,所以我們一般也​​會想到使用js對上傳的檔案大小以及格式進行初步的判斷,在服務端再進行一次判斷(防止瀏覽器拒絕執行腳本檔案)。
以下提供一個方法用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" : '圖片圖片>'
'音訊格式不正確
'
'視訊格式不正確
',
"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)

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!