欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

javascrip客戶端驗證文件大小及文件類型并重置上傳

 更新時間：2011年01月12日 00:24:52   作者：  
為了提高效率，很多時候需要在web頁面中對客戶端上傳的文件進行驗證，然后再上傳到服務器。
下面是我寫的一個通用的javascrip腳本，雖然調用時需要賦的參數(shù)比較多，但都是實際需要中真正需要使用到的。各位可以參考，并改成自己需要的腳本。
復制代碼 代碼如下:

/*****獲取文件信息 edit by zhaogw 參考by misssionOtherAttEdit.jsp*****/
/*file:input type="file"的對象，一般用this。
vType：一個對象名，用于記錄文件的文件類型信息。一般為input對象。
DivType：一個Div對象的名稱。把其innerHTML內容用于顯示文件的類型信息。
vFile:一個對象名，用于記錄文件的文件名信息。一般為input對象。
DivFile:一個Div對象的名稱。把其innerHTML內容用于顯示文件的文件名信息。
vSize,DivSize同上面類似，只是記錄文件的大小信息。
mMaxSize:以m為單位計算其允許上傳的最大文件大小。
allowType:只接受的文件類型
*/
function getFileInfo(file,mMaxSize,allowType,vFile,DivFile,vType,DivType,vSize,DivSize){
var filePath = file.value;//文件路徑
var fileName;//文件名
var fileType;//文件類型
var tmpObj;//臨時對象
var notAllowType=new Array("exe","bat","asp","jsp","js","dll");
var mHTML=document.getElementById(file.name+'Td').innerHTML;
/*
var mHTML="<input type='file' name='"+
file.name+"' class='input100' id='"+file.id+
"' Tip='無法上傳空文件' contentEditable='false' tmt:required='true' focusTips='請輸入文件名' onChange='getFileInfo(this,"+
mMaxSize+",\""+allowType+"\",\""+vFile+"\",\""+DivFile+"\",\""+vType+"\",\""+DivType+"\",\""+vSize+"\",\""+DivSize+"\")'>";
*/
// alert(mHTML);
//get file name
if(filePath != null && filePath != ''){
var pass=true;
//文件類型
fileType = filePath.substring(filePath.lastIndexOf('.') + 1,filePath.length);
if (fileType!=null&&fileType!='')
{
for (var i in notAllowType){
if (fileType.toLowerCase()==notAllowType[i]){
pass=false;
break;}
}
}
//允許的類型，空的話就不設置允許類型
var match=false;
if (allowType!=null&&allowType!=''){
var allowList=allowType.split('|');
for (var j in allowList){
if (fileType.toLowerCase()==allowList[j].toLowerCase()){
match=true;
break;}
}
} else {match=true;}
if (pass&&match)
{
fileName = filePath.substring(filePath.lastIndexOf('\\') + 1,filePath.length);
tmpObj=document.getElementById(vType);
if (tmpObj!=null)
tmpObj.value = fileType;
tmpObj=document.getElementById(DivType);
if (tmpObj!=null)
tmpObj.innerHTML = fileType;
tmpObj=document.getElementById(vFile);
if (tmpObj!=null)
tmpObj.value = fileName;
tmpObj=document.getElementById(DivFile);
if (tmpObj!=null)
tmpObj.innerHTML = fileName;
try{
var fso,f,s;
fso = new ActiveXObject("Scripting.FileSystemObject");
f = fso.GetFile(file.value);
if(f.Size > mMaxSize*1048576){
alert("文件大小不能超過"+mMaxSize+"M");
document.getElementById(file.name+'Td').innerHTML = mHTML;
tmpObj=document.getElementById(vType);
if (tmpObj!=null)
tmpObj.value = '';
tmpObj=document.getElementById(DivType);
if (tmpObj!=null)
tmpObj.innerHTML = '';
tmpObj=document.getElementById(vFile);
if (tmpObj!=null)
tmpObj.value = '';
tmpObj=document.getElementById(DivFile);
if (tmpObj!=null)
tmpObj.innerHTML = '';
tmpObj=document.getElementById(vSize);
if (tmpObj!=null)
tmpObj.value = '';
tmpObj=document.getElementById(DivSize);
if (tmpObj!=null)
tmpObj.innerHTML = '';
return;
}
else
{
tmpObj=document.getElementById(vSize);
if (tmpObj!=null)
tmpObj.value = f.Size;
tmpObj=document.getElementById(DivSize);
if (tmpObj!=null)
tmpObj.innerHTML = f.Size+" byte(字節(jié))";
var imgType=new Array("jpg","jpeg","gif","bmp");
var isImg=false;
//文件類型
if (fileType!=null&&fileType!='')
{
for (var k in imgType){
if (fileType.toLowerCase()==imgType[k]){
isImg=true;
break;}
}
}
var tmpObj=document.getElementById("imgView");
if (isImg&&tmpObj){
var y = document.getElementById(file.name+"img");
if(y){
y.src = "file://localhost/" + file.value;
}else{
var img=document.createElement("img");
img.setAttribute("src","file://localhost/"+file.value);
img.setAttribute("width","120");
img.setAttribute("height","90");
img.setAttribute("id",file.name+"img");
tmpObj.appendChild(img);
}
}}
}catch(e){
//ignore
}
}
else if (!pass) {alert("不允許上傳文件類型為："+fileType);document.getElementById(file.name+'Td').innerHTML = mHTML;}
else if (!match) {alert("只允許上傳文件類型為："+allowType);document.getElementById(file.name+'Td').innerHTML = mHTML;}
}
}

調用方法的代碼：
復制代碼 代碼如下:

<td width="23%" class="inputTd" id="fileNameTd" colspan="3">
<input type="file" name="fileName" class="input100" id="fileName" Tip="無法上傳空文件" Usage="notempty" contentEditable="false" tmt:required="true" focusTips="請輸入文件名" onChange="getFileInfo(this,10,'','vo.fileName','fileNameTd2','vo.fileType','fileTypeDiv','vo.fileSize','fileSizeDiv')">
<input type="hidden" name="vo.fileName" id="vo.fileName">
<span id="fileNameDiv" name="fileNameDiv"></span>
</td>

需要顯示當前上傳圖片的需要加入以下代碼：

<div id="imgView">&nbsp;</div>

簡單說明下腳本的相關約定：

1：如必須使用<td>對象來（或者別的有innerHTML屬性的對象來包含著input的type="file"的對象，并且名稱必須是input的name屬性+"Td"為后綴）
2：imgView寫死了，由于不想再加入更多的參數(shù)，因此，這里就固定這個了。大家也可以把名稱作參數(shù)傳遞進去。看各位的方便了。
3：所有參數(shù)都可以為''但第一個參數(shù)基本上是this。腳本會自動去判斷相關的參數(shù)的。

相關文章

最新評論