利用javascript/jquery對(duì)上傳文件格式過(guò)濾的方法
更新時(shí)間:2009年07月25日 10:37:12 作者:
jquery中對(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(){
$("#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>
您可能感興趣的文章:
- AngularJS模糊查詢功能實(shí)現(xiàn)代碼(過(guò)濾內(nèi)容下拉菜單排序過(guò)濾敏感字符驗(yàn)證判斷后添加表格信息)
- js中過(guò)濾特殊字符的正則表達(dá)式
- js過(guò)濾HTML標(biāo)簽以及空格的思路及代碼
- Javascript 5種方法實(shí)現(xiàn)過(guò)濾刪除前后所有空格
- js特殊字符過(guò)濾的示例代碼
- 用js實(shí)現(xiàn)過(guò)濾script的正則
- JS敏感詞過(guò)濾代碼
- js過(guò)濾HTML標(biāo)簽完整實(shí)例
- 用于過(guò)濾空白字符的幾種常見(jiàn)的js正則表達(dá)式pattern
- js限制input只能輸入有效的數(shù)字(第一個(gè)不能是小數(shù)點(diǎn))
- 原生JS 實(shí)現(xiàn)的input輸入時(shí)表格過(guò)濾操作示例
相關(guān)文章
jQuery noConflict() 方法用法實(shí)例分析
這篇文章主要介紹了jQuery noConflict() 方法用法,結(jié)合實(shí)例形式分析了jQuery noConflict() 方法基本功能、用法及操作注意事項(xiàng),需要的朋友可以參考下2020-05-05
jquery學(xué)習(xí)總結(jié)(超級(jí)詳細(xì))
本文僅針對(duì)jquery的部分知識(shí)點(diǎn)做總結(jié),更為全面的可以去官網(wǎng)看中文文檔??梢愿鼮樵敿?xì)的了解jquery及其特性。2014-09-09
JQuery 表單中textarea字?jǐn)?shù)限制實(shí)現(xiàn)代碼
textarea中的字?jǐn)?shù)的限制是在1000個(gè)之內(nèi),下面是具體的實(shí)現(xiàn)代碼,基本上會(huì)點(diǎn)jquery的能看懂,不懂的可以學(xué)習(xí)下jquery,當(dāng)期比較流行了,要不就落伍了。2009-12-12
基于daterangepicker日歷插件使用參數(shù)注意的問(wèn)題
下面小編就為大家?guī)?lái)一篇基于daterangepicker日歷插件使用參數(shù)注意的問(wèn)題。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-08-08
jQuery實(shí)現(xiàn)的一個(gè)tab切換效果內(nèi)部還嵌有切換
這篇文章主要介紹了jQuery實(shí)現(xiàn)的一個(gè)tab切換效果,它的特色是內(nèi)部還嵌有切換,需要的朋友可以參考下2014-08-08
jQuery實(shí)現(xiàn)移動(dòng)端手機(jī)商城購(gòu)物車功能
這篇文章主要介紹了jQuery實(shí)現(xiàn)移動(dòng)端手機(jī)商城購(gòu)物車功能的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-09-09

