快捷導(dǎo)航

利用javascript/jquery對(duì)上傳文件格式過(guò)濾的方法

更新時(shí)間：2009年07月25日 10:37:12 作者：

jquery中對(duì)上傳文件格式過(guò)濾的方法,需要的朋友參考下。

 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<style><!-- 
.errorInfo{ 
color:red; 
padding-left:5px; 
} 
--></style><style bogus="1"> .errorInfo{ 
color:red; 
padding-left:5px; 
}</style> 
<script type="text/javascript"><!-- 
$(function(){ 
$("#DataReport").click(function(){ 
//上傳文件不能為空，格式必須為xsl和xlsx 
var flag=true; 
var fileObject=$("input[name='file']"); 
var filepath=$("input[name='file']").val(); 
if(filepath==undefined||$.trim(filepath)==""){ 
fileObject.focus().next().text("請(qǐng)選擇上傳文件！"); 
flag=false; 
}else{ 
var fileArr=filepath.split("\\"); 
var fileTArr=fileArr[fileArr.length-1].toLowerCase().split("."); 
var filetype=fileTArr[fileTArr.length-1]; 
if(filetype!="xls"&&filetype!="xlsx"){ 
fileObject.focus().next().text("上傳文件必須為Excel文件！"); 
flag=false; 
}else{ 
fileObject.next().text(""); 
} 
} 

//進(jìn)行其他相關(guān)校驗(yàn) 

if(flag){ 
alert("文件上傳成功"); 
} 
}); 
}); 

// --></script> 

</head> 
<body> 
<form action="#" method="POST" enctype="multipart/form-data"> 
<div><input type="file" name="file"><span class='errorInfo'></span></div> 
<div><input type="button" value="上傳" id="DataReport"></div> 
</form> 
</body> 
</html> 

注：在head中加入jquery的引入語(yǔ)句，博客還是會(huì)過(guò)濾掉引入的js文件。
javascript中對(duì)上傳文件格式過(guò)濾的方法：

復(fù)制代碼代碼如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<style><!-- 
.errorInfo{ 
color:red; 
padding-left:5px; 
} 
--></style><style bogus="1"> .errorInfo{ 
color:red; 
padding-left:5px; 
}</style> 
<script type="text/javascript"><!-- 
function validateFile(){ 
var flag=true; 
var fileObject=document.getElementById("file"); 
var errorObject=document.getElementById("error"); 
var filepath=fileObject.value; 
if(filepath==undefined||filepath==""){ 
fileObject.focus(); 
errorObject.innerText="請(qǐng)選擇上傳文件！"; 
flag=false; 
}else{ 
var fileArr=filepath.split("\\"); 
var fileTArr=fileArr[fileArr.length-1].toLowerCase().split("."); 
var filetype=fileTArr[fileTArr.length-1]; 
if(filetype!="xls"&&filetype!="xlsx"){ 
fileObject.focus(); 
errorObject.innerText="上傳文件必須為Excel文件！"; 
flag=false; 
}else{ 
errorObject.innerText=""; 
} 
} 
//進(jìn)行其他相關(guān)校驗(yàn) 
if(flag){ 
alert("文件上傳成功"); 
} 
} 
// --></script> 
</head> 
<body> 
<form action="#" method="POST" enctype="multipart/form-data"> 
<div><input type="file" id="file"><span id="error" class='errorInfo'></span></div> 
<div><input type="button" value="上傳" id="DataReport" onclick="validateFile()"></div> 
</form> 
</body> 
</html>